Google Analytics hitCallback event tracking not working

Question

I am trying to track a link being clicked using event tracking and hitcallback. My analytics code looks like this...

<script type="text/javascript">//<![CDATA[
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXXXX-X']);
_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);
})();
//]]></script>

And the link I am trying to track looks like this....

<a href='http://cool.com/' onclick="var href = this.href; ga('send','event','outbound','click', this.href, {'hitCallback': function(){document.location = href;}}); return false;">Cool</a>

I followed the hitcallback example from http://www.swellpath.com/2013/12/universal-analytics-using-hitcallback/ but its still not working.

Am I missing something?

Answer 1

The problem is you are attempting to use Universal Analytics syntax (analytics.js) for your click tracking, but the GA library you are using is the older _gaq (ga.js) syntax.

_gaq style does let you specify a callback function, though it's undocumented. Basically you have to _set the callback function before you make the _trackEvent call.

Your link should look like this:

<a href='http://cool.com' onclick="var _this=this;_gaq.push(['_set','hitCallback',function(){document.location=_this.href;}]);_gaq.push(['_trackEvent','outbound','click',_this.href]);return false;">cool</a>