Tuesday, July 08, 2014

Track events using google analytics via hitCallback

If you are using google analytics to track clicks/events then at some point you may want to track submits of forms. The only one way to do that is to use hitCallback function. It is easy to do it, however many people forget to verify cases when google analytics library is blocked, f.x. by extensions AdBlock or Ghostery) and it means hitCallback will not be defined and simply will not work.

Google analytics classic
jQuery(".form").on("submit", function(f) {
  var _this = this;
  _gaq.push(['_set','hitCallback',function() {
    $(_this).parents('form').first().submit();
  }]);
  _gaq.push(['_trackEvent', '/signup']);
  // here is check if google-analytics.js is loaded and if not - return true, otherwise false
  return !window._gat;
})
Google analytics universal
jQuery(".form").on("submit", function(f) {
  var _this = this;
  ga('send', 'pageview', '/signup', {
    'hitCallback': function() {
      $(_this).parents('form').first().submit();
    }
  })
  // here is check if google-analytics.js is loaded and if not - return true, otherwise false
  return !(ga.hasOwnProperty('loaded') && ga.loaded === true);
})

No comments :