2.6 KiB
isHidden | menupriority | kind | created_at | title | subtitle | author_name | author_uri | tags | ||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
false | 1 | article | 2010-06-17T14:41:36+02:00 | Track Events with Google Analytics | Asynchronous Complete Google Analytics with jQuery | Yann Esposito | yannesposito.com |
|
Here is how to track all clicks on your website using google analytics asynchronously.
First in your html you need to use jQuery and a javscript file I named yga.js
:
And here is the yga.js
file:
$(document).ready( function() {
// add an event to all link for google analytics
$('a').click(function () {
// tell analytics to save event
try {
var identifier=$(this).attr('id') ;
var href=$(this).attr('href')
var label="";
if ( typeof( identifier ) != 'undefined' ) {
label=label+'[id]:'+identifier
category='JSLink'
}
if ( typeof( href ) != 'undefined' ) {
label=label+' [href]:'+href
if ( href[0] == '#' ) {
category='Anchor';
} else {
category='Link';
}
}
_gaq.push(['_trackEvent', category, 'clicked', label]);
// console.log('[tracked]: ' + category + ' ; clicked ; ' + label );
}
catch (err) {
console.log(err);
}
// pause to allow google script to run
var date = new Date();
var curDate = null;
do {
curDate = new Date();
} while(curDate-date < 300);
});
});
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXXXX-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
Replace the: UA-XXXXXXXX-1
by your google analytics code and you're done.
To see what occurs, simply go in Content
and Event Tracking
as shown in the following screenshot:
<%= blogimage('GA_events.png', 'Where to find events tracking in google analytics interface') %>
Happy tracking!