Once again the Google Analytics snippet is changing (evolving) into something bigger and better… Let’s take a look…
Default New Analytics.js Script
This is currently in beta.
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXX-Y'); // Creates a tracker.
ga('send', 'pageview'); // Sends a pageview.
I saw HTML5 Boilerplate have been clever and renamed the vars.. it now reads b,o,i,l,e,r … hehe..
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='//www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X');ga('send','pageview');
Don’t break you current tracking objects, simply rename the ga to whatever you’ve been using such as __gaTracker.
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','__gaTracker');
__gaTracker('create', 'UA-XXXX-Y');
__gaTracker('send', 'pageview');
Testing on localhost
In some cases you might want to test analytics.js from a webserver running on localhost. To set analytics.js cookies, you need to disable the default cookie domain using:
ga('create', 'UA-XXXX-Y', {
'cookieDomain': 'none'
});
Tracking your hash urls on your web apps. you can set the page url like this. Add that to your page templates.
ga('set', 'page', '/splash');
ga('send', 'pageview');
OR
ga('set', 'page', '/#login');
ga('send', 'pageview');
Don’t forget to remove the send from your main snippet. So it now looks like this:
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXX-Y', 'domain.com');
To capture a new event simply add this when you want the event tracked
ga('send', 'event', 'category', 'action', 'label', value);
Where label and value are optional.
For example,
ga('send', 'event', 'register', 'currentUser');
GA Basic Config: https://developers.google.com/analytics/devguides/collection/analyticsjs/
GA Advanced Config: https://developers.google.com/analytics/devguides/collection/analyticsjs/advanced?hl=es
![Sam Deering](https://uploads.sitepoint.com/wp-content/uploads/2018/10/1539663963Sam-Deering-150x150.jpg)
Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.