We have a site that uses Marketo embedded Marketo forms. We want to implement a bit more sophisticated conversion tracking other than a button click for form submission. The thought is we would work with the Forms 2.0 API and utilize the onSuccess callback. After a successful callback we would push the conversion to Google Analytics.
I'm not a coder by trade but my understanding is that I would use a variation of this code.
MktoForms2.loadForm("//app-ab00.marketo.com", "785-UHP-775", 1057, function(form) {
// Add an onSuccess handler
form.onSuccess(function(values, followUpUrl) {
// Get the form's jQuery element and hide it
form.getFormElem().hide();
// Return false to prevent the submission handler from taking the lead to the follow up url
return false;
});
});
According to this article it is suggested that something along the lines of the following code be inserted
ga('send', 'event', {
eventCategory: 'event_registration',
eventAction: 'form-submit',
eventLabel: 'page title' // I'm planning on replacing this with a dynamic value that grabs the page title if possible
});
in place of
form.getFormElem().hide();
The final comment in that article suggests the code is incomplete and the user should use the GA hitCallback feature.
This article seems to give some hints on how to do this since they use the hitCallback function with the onSuccess handler but I am not sure I completely understand how it functions. This is also utilizing the data layer instead of the just pushing the event into Google Analytics as the first bit of code does.
The code:
form.onSuccess(function(values, followUpUrl){
dataLayer.push({
'event': 'marketo.success',
'marketo.form_id': form_id,
'marketo.form_values': values,
'eventCallback': function() {
dataLayer.push({
'marketo.follow_up_url': followUpUrl
})
}
});
I'm fine with using the data layer since I'd want to use this data in other analytics platforms. My question is how do I implement this? Should it look something like this?
MktoForms2.loadForm("//app-ab00.marketo.com", "785-UHP-775", 1057, function(form) {
// Add an onSuccess handler
form.onSuccess(function(values, followUpUrl) {
form.onSuccess(function(values, followUpUrl){
dataLayer.push({
'event': 'marketo.success',
'marketo.form_id': form_id,
'marketo.form_values': values,
'eventCallback': function() {
dataLayer.push({
'marketo.follow_up_url': followUpUrl
})
}
});
return false;
});
});
Any thoughts on how to fully implement this from the code to what needs to be set up in Google Tag Manager?
... View more
Customize up to 8 badges at the top of your trophy case for all other Community members to see!
Ignite 3
Earned on 5.11.21
Earned by 782 people
Select to learn more
Validate 1
Earned on 2.08.21
Earned by 377 people
Select to learn more
Give Back 5
Earned on 2.08.21
Earned by 809 people
Select to learn more
Give Back 3
Earned on 2.08.21
Earned by 1203 people
Select to learn more
Give Back 10
Earned on 2.08.21
Earned by 498 people
Select to learn more
Affirm 1
Earned on 2.08.21
Earned by 458 people
Select to learn more
Give Back 1
Earned on 2.08.21
Earned by 2450 people
Select to learn more
Ignite 1
Earned on 2.08.21
Earned by 2448 people
Select to learn more
.png)