Integrating Marketo and Google Analytics - Question

[Katie_Delvalle]

Hello, 

I have completed the steps outlined in this tutorial with about 95% success. Here is what I've been able to do:

• Modify my form embed code to track events with Google Tag Manager
• Modify my form embed code to push the Google Analytics Client ID back to a hidden field on the form. 
• Create a web hook to send the Marketo Unique User ID to Google Analytics via a new event that's performed from the web hook. 

Where I'm stuck - I want the Marketo Unique User ID to show up on the user explorer as an additional custom dimension that I've labeled as UserId (I know they are different, but I'm rolling with it for now). I have the custom dimension set to user so it's visible on the user explorer section within GA, but it's listed as (not set). I've verified that the web hook is pushing this data and populating the custom dimension because when I look at it from an event perspective it's there. When I try to view the data from the user's perspective it's not set with the event logged. What am I missing to tie that unique id to the user in Google Analytics?  

My form embed code: 

<script src="//app-ab16.marketo.com/js/forms2/js/forms2.min.js"></script>
<form id="mktoForm_2021"></form>
<script>MktoForms2.loadForm("//app-ab16.marketo.com", "889-DKW-954", 2021,
function(form){
form.onSuccess(function(values, followUpUrl){
dataLayer.push({event:'mktoLead',mktoFormId:
form.getId()});
// rest of your success handler...
return true;
});
// Set the value of the GA client id
function getgacid() {
try {
var tracker = ga.getAll()[0];
return tracker.get('clientId');
} catch (e) {
return 'n/a';
}
}
form.vals({
'gacid': getgacid()
});
});
</script>

My webhook info: 

https://www.google-analytics.com/collect?v=1&t=event&tid=UA-65670986-7&cid={{lead.ga.cid:default=edit me}}&ec=marketo&ea=webhook&el={{Lead.Marketo Unique Code}}&cd3={{Lead.Marketo Unique Code}}

I just made my test page a password protected page so that should protect normal users from finding it while still giving all of you access to help me. The url is https://www.arvigbusiness.com/katies-form-test-page/ password is test.

[SanfordWhiteman]

The client-side JS is wrong (+ the blog post it came from is wrong).  You must use an eventCallback listener - search my posts for notes on that.

[Katie_Delvalle]

Hi Sanford,

Thanks again for such a quick response. Just to make sure I'm understanding what you are saying correctly, The form embed code is using the incorrect Google function.  (Pardon me if this isn't the right terminology! I'm learning on the go). So instead of my form code section that is: 

<script>MktoForms2.loadForm("//app-ab16.marketo.com", "889-DKW-954", 2021,
function(form){
form.onSuccess(function(values, followUpUrl){
dataLayer.push({event:'mktoLead',mktoFormId:
form.getId()});
// rest of your success handler...
return true;
});
// Set the value of the GA client id
function getgacid() {
try {
var tracker = ga.getAll()[0];
return tracker.get('clientId');
} catch (e) {
return 'n/a';
}
}
form.vals({
'gacid': getgacid()
});
});
</script>

I should instead combine the two functions (push event info to GTM & then capture GA.CID for hidden field) into one? 

Post - https://nation.marketo.com/t5/Product-Discussions/How-to-use-the-Marketo-forms-events-in-GTM/td-p/10...& https://nation.marketo.com/t5/Product-Discussions/Google-Tag-Manager-Form-Fill-Out-Tracking/td-p/814... 

<script>MktoForms2.loadForm("//app-ab16.marketo.com", "889-DKW-954", 2021,
function(form){
form.onSuccess(function(values, followUpUrl){
dataLayer.push({
      'event' : 'formSubmit',
      'eventCallback' : function() {
        document.location.href = tyURL;
      },
      'eventTimeout' : 3000
    });
    return false;
  });
});

 If my very basic understanding is correct this is saying send the event to datalayer and don't move onto the next process until GA has registered this event. Would you confirm that's correct? 

The block of original code does push the event information to data layer and I have been successful in capturing the event information & pushing the event to GA. I've also been successfully capturing the GA.CID correctly and storing that data in the hidden field I created.

The challenge I'm having, I think, is with the Webhook. The form custom java successfully does the event and saves GA.CID but the next step is to use the campaign flow to trigger the webhook to send the Lead ID to GA. This part is also working (YAY!) but the Lead ID doesn't get attached to the GA.CID within the individual user. Would that be some missing function on the webhook or does the form embed code send the Lead ID. I thought in other posts you said we can't do it that way because the Lead ID is created seconds after the onSuccess function and we can't delay a thank you page for that amount of time..  

I've tried doing as much research as a I can but all of this has been a lot of guesswork and this is where I'm stuck.

[Katie_Delvalle]

Also I will bring your form code feedback to my developer and see if we can incorporate your suggestions so that it's more reliable which is what I'm guessing you wanted us to do! 

Thanks for helping make that section even better! 😊

[Katie_Delvalle]

Does anyone have any additional insights or directions on how to solve this?  

Thanks! 

[Melissa]

I'm looking to do this right now, so I'd love to hear if you (or Marketo) have created an easier way Katie. 

[Katie_Delvalle · Accepted solution]

This took a lot of trial and error and eventually I had one of my software developers troubleshoot the form. What was found is the lines of Google code were a bit off. Here is what I now have and it's working!! 🙂 

<script src="//app-ab16.marketo.com/js/forms2/js/forms2.min.js"></script>
<form id="mktoForm_2021"></form>
<script>MktoForms2.loadForm("//app-ab16.marketo.com", "889-DKW-954", 2021,
function(form){
form.onSuccess(function(values, followUpUrl){
dataLayer.push({event:'mktoLead',mktoFormId:
form.getId()});
// rest of your success handler...
return true;
});
// Set the value of the GA client id
function getgacid() {
try {
var tracker = ga.getAll()[0];
return tracker.get('clientId');
} catch (e) {
return 'n/a';
}
}
form.vals({
'gacid': getgacid()
});
});
</script>

Just sharing a tip I've learned after this. The same customizations you put in your embed forms needs to get added to the landing page templates for any Marketo Landing Pages with Forms. It's well worth the effort and I can now get good insights into where my user was at before and after they completed the form so I'm happy with the solution. 

Good Luck! 

[SanfordWhiteman]

This code is actually not right.

If you don't use the eventCallback feature and allow the onSuccess to proceed (by returning true), you are losing traffic by definition — you just aren't noticing it because you haven't tested in enough browsers.

@Amy_Goldfine