Adding Google Analytics tracking in CFv4

Hi,

I'm struggling a little with the addition of Google Analytics in CFv4.

I added a custom code action on the onLoad event as seen a separate post:

<?php
$form->form_params->set('jsvalidation_onValidateSuccess', 'trackEvent');
?>

I placed this first, before Show HTML.

Then I added a LoadJS action to the onSubmit event as follows:

function trackEvent() {
  _gaq.push(['_trackEvent', 'Contact', 'Myformname', 'Submit']);
}

I placed this LoadJS action first, before DB Save, Email and Show Thanks message.

It's not working and I'm not sure what else to try.

Any help gratefully accepted.

Thanks in advance.

Hello qmeister,
I'm not a Chrono professional, but after checking your new post, I think that the following links may help:
How can I add Google Analytics event tracking in CFv5?
P.S: I'm just an automated service😉

Hi qmeister,

When do you want to do the tracking - when the form loads i,e, it's viewed, or after it submits?

The FAQ Prof Calculus linked to won't quite work in CFv4.

Bob

Hi,

Thanks for getting back to me. I want the tracking to occur on submit. I've only found CFv3 and CFv4 posts which deal with that, so grateful if you could point me in the right direction.

Many thanks
Quentin

Hi Quentin,

Just add the tracking code into a "Load JavaScript" action inside the "on submit" event.

Regards,
Max

Hi Max,

Thanks for the response. I tried as suggested but still no luck.

Removed the custom code action on the onLoad event as mentioned above. That left me with the LoadJS action on the onSubmit event as follows:

function trackEvent() {

  _gaq.push(['_trackEvent', 'Contact', 'Myformname', 'Submit']);

}

Still not working.

Hi qmeister,

I checked the Google Analytics docs and it looks as though this should work, again in a Load JS action in the On Submit event:

(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', 'auto');
ga('send', 'pageview');

replacing UA-XXXX-Y with the Property ID for the Google Analytics Property you wish to track.

Bob

Hi,

Thanks for getting back to me. I tried as suggested but without any luck.

Our form opens in a popup and that may be what is complicating things. I also tried adding the GA tracking code which we have in our template to the LoadJS event and then also added the event function in the same LoadJS event as follows:

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXXXX-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);
  })();

function trackEvent() {
  _gaq.push(['_trackEvent', 'Contact', 'Myformname', 'Submit']);
}

I really thought this would work but no luck with it either.

Grateful for any additional suggestions!

Hi qmeister,

Please post a link to the form so I can take a quick look.

Bob

Hi qmeister,

I don't see the code that I suggested on the page?

The code that is there is showing a JavaScript error "Uncaught SyntaxError: Unexpected token ILLEGAL" for this line

   _gaq.push([’_trackEvent’, ’Contact’, ’Request A Sample’, ’Submit’]);

I suspect because there are curly quotes there instead of straight ones.

Bob

Hi Bob,

I updated with the code you suggested and changed the quotes to straight ones so you can check. I had this before and it did not work. Still doesn't work.

Hi qmeister,

In the Chrome Console I added breaks to the two ga() methods and they are both being executed when the thank you page loads. So maybe the code isn't the right version? Is there any way to debug from the GA end?

Bob

Hi,

The code version I'd say is wrong, because in our template we have the other version. I've updated as follows but still no luck.

 
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', ' UA-XXXXXXX-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);
  })();

function trackEvent() {
   _gaq.push(['_trackEvent', 'Category', 'Action', 'Label']);
}

I'm not aware of any way to troubleshoot from the GA side.

Hi GreyHead,

I'm afraid I'm still struggling with this - the event tracking is still not working and I'm not sure what else to try.

Any ideas?

Thanks in advance.