1

I need to use the custom ga('send') function to send data that's triggered on a form submit, specifically through Marketo.

On web properties where GA is installed as a script tag, this works great. However, on one site I need to do this on, GA is installed as a tag through GTM. It's apparently a best practice.

Basically the code looks like this (for context):

form.onSuccess(function (values, url) {
    console.log('success');
    ...
    ga('send', 'event', {
       eventCategory: 'form',
       eventAction: 'submit',
       eventLabel: 'Form Submit'
     });
     ...
     return false;
 });

I did some research

How to send ga(...) events with Google Tag Manager?

Google Analytics Code Explanation

The premise is that I need to define the ga() function in the first place - so I do that like so:

window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', "UA-XXXXXXXX", 'auto');
form.onSuccess(function (values, url) {
     console.log('success');
     ...
     ga('send', 'event', {
           eventCategory: 'form',
           eventAction: 'submit',
           eventLabel: 'Form Submit'
     });
     ...
     return false;
 });

I can see the `console.log("success") and no errors are being thrown but I'm not seeing the form submission event being logged in GA.

Any ideas? How do I do custom events with a Google Tag Manager implementation of GA vs a script tag?

kawnah
  • 3,204
  • 8
  • 53
  • 103
  • Possible duplicate of [How to track custom events when Google Analytics is managed by Google Tag Manager?](https://stackoverflow.com/questions/55675935/how-to-track-custom-events-when-google-analytics-is-managed-by-google-tag-manage) – kgrg Oct 25 '19 at 20:40

1 Answers1

1

On marketo form pages where GA is implemented through a GTM tag, then you should look into using custom datalayer events for this.

Don't be afraid of the word "custom", essentially instead of the ga() function, you would do:

dataLayer.push({'event': 'event_name'});

So your code becomes:

form.onSuccess(function (values, url) {console.log('success');
...dataLayer.push({'event': 'form-submit'});...return false;});

THEN IN GTM:

  1. Create a trigger based on that custom event ('form-submit') you just coded to push to the datalayer, like so: enter image description here
  2. Then create a GA tag, set track type "EVENT", fill in the category, action and label as you wish. Then attach the trigger you created in step 1. Like so: enter image description here
  3. Preview or submit everything to see it working.
XTOTHEL
  • 5,098
  • 1
  • 9
  • 17
  • Great answer! I pushed the update on the tag and the JS code, is there usually a delay when we'll see it in the analytics panel? – kawnah Oct 25 '19 at 18:58
  • Yes there is usually a delay, but if you go to "Real Time > Events" in GA, you should see it as you click on the forms. Make sure if you have tracking/ad blockers, you turn them off. You can also use GTM Debug mode to confirm that the tag is firing on submit. – XTOTHEL Oct 25 '19 at 19:08