WordPress + Goggle Analytics Opt-Out
Without 3rd Party Plugins
This is a modest blog in the USA. While this site isn’t governed by the GDPR, I do use Google Analytics and I want visitors to be able to opt-out of tracking if they want. This is also a handy way for site admins & others to exclude themselves from Analytics reporting for their own sites. Here’s how I did it.
Goals
Before setting out on any coding adventure, I always outline what I want to do, how I might do it, and how I’ll know if it works.
At this point my needs are simple:
- Add a GA global tag to the site
head
. - Present users with a way to opt-out of GA for my site.
- Display this option on the Privacy Policy page (Admin > Settings > Privacy).
For this I’m going to try using:
wp_head
to add the Google scripts – one for tracking + one for opt-out.get_option
to find the Privacy Policy page and conditionally add the opt-out script.- A
[shortcode]
for placing the opt-out link anyewhere needed.
I’ll know it works if:
- The GA global tag script appears on all site pages.
- The GA opt-out script loads only on the Privacy Page.
- Clicking the opt-out link triggers a visible
alert
. - Clicking the opt-out link adds the
ga-disable
cookie for the current device and browser.
GA Opt-Out Options
In the USA, there are several ways to opt out of Google Analytics:
- Don’t use sites running Analytics – which is pretty much every site, so not a feasible option.
- Manually manage cookies via web browser settings – not hard, but not convenient either.
- Install the official Google Analytics Opt-Out Browser Add-On – this allows you to opt out of tracking on all sites, but I don’t suggest it.
- Opt-out for individual sites that provide a mechanism – what I’m doing here.
Where To Put The Code
Child theme?
If you’re using a child theme, your custom code will always go there. If, like me, you’re using a completely custom theme, code can go directly in those files.
Files
While you can place this code in functions.php
, I suggest creating a separate file that’s required by the theme. Mine is theme/inc/knotty-ga.php
.
Get GA Global Tag
When you create a new GA property, the wizard provides code for your site’s global tag.
Note that in GA, properties are also called accounts. Don’t confuse this with needing a separate Google account for each site / property – you don’t.
- Sign in to your Google account.
- Navigate to https://analytics.google.com/.
- In the upper-right, click your user icon > Add Account (property).
- Follow the on-screen steps.
For existing properties, you can regenerate the code by:
- Sign in to Google and navigate to Analytics.
- In the lower-left, click the Admin (gear) icon. A new page loads.
- In the Property column, click Tracking Info > Tracking code.
Add Global Tag
This code adds the GA global tag to a site’s head
. Use the example below by replacing all instances of UA-XXXXXXXXX-X
with your site’s property ID.
Even better would be to replace the two inner JS tags with the block Google generates.
Add Opt-Out Script
This code powers the opt-out link – it sets the ga-disable
cookie and displays an on-screen alert.
Notice I’m using wp_head
a second time. This could go with the previous example if it were needed on all pages. Here, I’m conditionally adding it to just the site’s Privacy page.
Make Shortcode
The opt-out can be displayed as a link:
<a href="javascript:gaOptout()">Opt out of Google Analytics for this site</a>
Or as a button:
<button onclick="gaOptout()">Opt out of Google Analytics for this site</button>
The problem is, you can’t enter either of these into the Visual or Text editors – the JS is stripped on save.
To solve this, I created a [ga_opt_out]
shortcode:
Testing
I always test in a local or stage environment where I have FTP access should things go bad – I suggest you do too.
Once the updated theme files are in place, clear your caches, and check that:
- The GA global tag scripts are loading on every page.
- The GA opt-out script is loading on just the Privacy page.
WP_DEBUG
& dev tools show no errors.
Next, edit your Privacy page and insert the [ga_opt_out]
shortcode where desired.
Next, view the Privacy page and click the opt-out link or button. An on-screen alert is displayed.
Finally, use your browser’s dev tool to check for the ga-disable
cookie. In Chrome, click the Application tab > Storage: Cookies > Site name.
Wrap
Whew – did it! I’m still new enough to WordPress theme development to be super excited when I accomplish this kind of thing. I document these adventures for my own benefit – if you’ve made it this far, thanks and I hope it helps you in some way!