SOLVED

Google Tag Manager Form Fill Out Tracking

Go to solution
Highlighted
Anonymous
Not applicable

Google Tag Manager Form Fill Out Tracking

I’ve been trying to place a script on our Marketo landing pages so we can track form submissions.  Please note: I’m a very poor developer, so I had to try researching everything I could for this information. 

I found a blog post that I thought had my answer (https://www.wpromote.com/blog/setting-up-google-analytics-event-tracking-for-marketo-landing-pages/). However, it’s not working properly.  Here’s the Javscript I put together:

<script language="javascript">

  1. window.onload=function(){
  2. document.getElementById('mktoForm_1341').onClick="ga(‘send’, ‘event’, { eventCategory: ‘marketo’, eventAction: ‘form-fill’, eventLavel: ‘test1’});"}

</script>

And nothing’s firing properly upon a successful form completion.  Here is the landing page I’m testing this all out with: http://pages.na.industrial.panasonic.com/Grid-EYE-Landing-Page-lella-test.html

Can someone help me troubleshoot this issue?  Thank you!

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Level 10 - Community Moderator

Re: Google Tag Manager Form Fill Out Tracking

I found a blog post that I thought had my answer (https://www.wpromote.com/blog/setting-up-google-analytics-event-tracking-for-marketo-landing-pages/).

That guidance in that blog post is competely wrong for Marketo forms (or really all forms). Never capture a click on the submit button. That will register a conversion even if the person doesn't enter any information in the form: button clicks fire no matter whether validation fails or succeeds.

Also, you can't use window.onload with Marketo forms. There's no guarantee at all that the form will exist on the page when onload fires.


And you don't use DOM events on Marketo forms, you use their built-in event model.

You must capture the Forms API onSuccess event, and you must use the GA hitCallback option like so:

  MktoForms2.whenReady(function(form) {

    form.onSuccess(function(vals, tyURL) {

      ga('send', 'event', {

        eventCategory: 'marketo',

        eventAction: 'form-fill',

        eventLabel: 'test1',

        hitCallback: function() {

          document.location.href = tyURL;

        }

      });

      return false;

    });

  });

.

View solution in original post

10 REPLIES 10
Highlighted
Level 10 - Community Moderator

Re: Google Tag Manager Form Fill Out Tracking

I found a blog post that I thought had my answer (https://www.wpromote.com/blog/setting-up-google-analytics-event-tracking-for-marketo-landing-pages/).

That guidance in that blog post is competely wrong for Marketo forms (or really all forms). Never capture a click on the submit button. That will register a conversion even if the person doesn't enter any information in the form: button clicks fire no matter whether validation fails or succeeds.

Also, you can't use window.onload with Marketo forms. There's no guarantee at all that the form will exist on the page when onload fires.


And you don't use DOM events on Marketo forms, you use their built-in event model.

You must capture the Forms API onSuccess event, and you must use the GA hitCallback option like so:

  MktoForms2.whenReady(function(form) {

    form.onSuccess(function(vals, tyURL) {

      ga('send', 'event', {

        eventCategory: 'marketo',

        eventAction: 'form-fill',

        eventLabel: 'test1',

        hitCallback: function() {

          document.location.href = tyURL;

        }

      });

      return false;

    });

  });

.

View solution in original post

Highlighted

Re: Google Tag Manager Form Fill Out Tracking

Hey Sanford! Struggling to get this working on my site: https://www.ean.com/734748748484test-ga-form-2

Same setup as Bethany's but no Events showing in GA real-time.

Suggestions?

Highlighted
Level 10 - Community Moderator

Re: Google Tag Manager Form Fill Out Tracking

pastedImage_0.png

It's an upper-case "M": MktoForms2

Highlighted

Re: Google Tag Manager Form Fill Out Tracking

Seeing 'Uncaught ReferenceError: ga is not defined' now and the form won't submit. Thoughts?Screen Shot 2017-07-29 at 10.33.07.png

Highlighted
Level 10 - Community Moderator

Re: Google Tag Manager Form Fill Out Tracking

P.S. That isn't GTM tracking, it's standard GA tracking (which is indeed preferable unless you need GTM).

Highlighted

Re: Google Tag Manager Form Fill Out Tracking

Hi Bethany,

This is a method i've used:

{form.onSuccess(function(values, followUpUrl)

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

  return false;});});

In GTM, you can choose to fire a tag when this event ('form_success') occurs.

Highlighted
Level 10 - Community Moderator

Re: Google Tag Manager Form Fill Out Tracking

Gotta use an eventCallback there. Bethany's forms have separate Thank Yous.

Highlighted

Re: Google Tag Manager Form Fill Out Tracking

I don't follow. Does the final statement need to know the event has been sent?

Highlighted
Level 10 - Community Moderator

Re: Google Tag Manager Form Fill Out Tracking

When you return false from onSuccess, the person doesn't go to the Thank You page (this is good because you want to log an event beforehand).

You redirect them to the Thank You page after the event has been logged, using hitCallback (GA) or eventCallback (GTM).