Using Google Analytics for Ajax Powered Themes

Being based on an AJAX powered WordPress theme, your website is considered by Google Analytics to be more like an application and it’s not possible to use the default JavaScript tracking snippet to track your visitors.

There is a new official library released by Google called AutoTrack which help you exactly in this situation.

To install autotrack to your site, you have to do the following things:

1. Load the autotrack.js script file on your page (you can download it from here or load it via CDN as exemplified below).
2. Update your tracking snippet to require the various autotrack plugins you want to use on the tracker.
3. Insert the new tracking code into your website.

Step 1 – Update your GA Tracking Snippet

If your site is currently using the default JavaScript tracking snippet, you can modify it to something like this:

<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');

// Replace the following lines with the plugins you want to use.
ga('require', 'eventTracker');
ga('require', 'outboundLinkTracker');
ga('require', 'urlChangeTracker');

ga('send', 'pageview');
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
<script async src="https://cdnjs.cloudflare.com/ajax/libs/autotrack/2.3.2/autotrack.js"></script>

You’ll have to make the following modifications to the above code to customize autotrack to your needs:

• Replace UA-XXXXX-Y with your tracking ID
• Replace the sample list of plugins with the ones you want to use.
• (optional) Replace the path to autotrack.js with the actual location of the autotrack.js file hosted on your server.

Step 2 – Insert the Snippet into your Website

To insert the above code into your website, we recommend the free Simple Custom CSS and JS plugin. Once you install it, go to Custom CSS & JS → Add Custom HTML page, paste the above code and make sure to check the “Footer” placement option.