# Trigger Google Analytics Event with Form Submission

**URL:** <https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370>\
**Category:** APIs & Integrations\
**Tags:** forms\
**Created:** [September 7, 2017, 1:12pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370 "2017-09-07T13:12:17Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![amybeans](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/amybeans/32/30597_2.png) [@amybeans](https://community.hubspot.com/u/amybeans)\
**Post date:** [September 7, 2017, 1:12pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/1 "2017-09-07T13:12:17Z")

</div>

I read this article, which shows you how to add Google Analytics event tracking to a HubSpot form submission:

[developers.hubspot.com](https://developers.hubspot.com/docs/methods/forms/advanced_form_options)

### [How to customize the form embed code](https://developers.hubspot.com/docs/methods/forms/advanced_form_options)

This is a list of options that you can use if you just need to tweak a default hubspot form. If you need complete control over the styles and actions of your form, you will still want to use the Forms API.

I applied this to one of my embedded HubSpot forms, but it doesn’t seem to be tracking the event in Google Analytics. I am not using Google Tag Manager.

Here is the code I used:  
hbspt.forms.create({  
css: ‘’,  
portalId: ‘XXXXXXX’,  
formId: ‘XXXXXXX-XXX-XXX-XXXXXXX’,  
onFormSubmit: function($form) {  
“\_gaq.push([’\_trackEvent’, ‘Contact’, ‘contact\_us\_form’, ‘Main\_Contact\_Us’, false]);”  
},  
submitButtonClass: ‘btn btn-primary btn-hubspot’,  
locale: ‘en’,  
translations: {  
en: {phoneInvalidLengthOrFormat: ‘Please enter a valid phone number.’}  
}  
});

I realize that this is very similar to the question posed in this forum, but I followed these instructions and am still running into issues.

[Triggering a Google Analytics event](https://integrate.hubspot.com/t/triggering-a-google-analytics-event/2265/2)

> @Champion You could add the onFormSubmit function to the embed code which could then call your google analytics event.

Any help/guidance you could provide would be helpful.

Thanks!

---

<div class="post-metadata">

**Author:** ![Derek\_Gervais](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/derek_gervais/32/17429_2.png) [@Derek\_Gervais](https://community.hubspot.com/u/Derek_Gervais)\
**Post date:** [September 7, 2017, 9:31pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/2 "2017-09-07T21:31:32Z")

</div>

Hi @amybenes,

Based on some documentation I’ve read ([here](https://developers.google.com/analytics/devguides/collection/analyticsjs/events)), it looks like you might want to consider using something like this:

> ga(‘send’, ‘event’, ‘Videos’, ‘play’, ‘Fall Campaign’);

Regardless, you should remove the quotes surrounding the Google Analytics event inside the `onFormSubmit` function, as this worked in my own testing.

---

<div class="post-metadata">

**Author:** ![amybeans](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/amybeans/32/30597_2.png) [@amybeans](https://community.hubspot.com/u/amybeans)\
**Post date:** [September 14, 2017, 9:55pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/3 "2017-09-14T21:55:23Z")

</div>

Hi – this worked. thanks for your help!

---

<div class="post-metadata">

**Author:** ![system](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/system/32/124_2.png) [@system](https://community.hubspot.com/u/system)\
**Post date:** [February 12, 2018, 12:49pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/4 "2018-02-12T12:49:47Z")

</div>

Where you paste that code?  
“Here is the code I used:  
hbspt.forms.create({  
css: ‘’,  
portalId: ‘XXXXXXX’,  
formId: ‘XXXXXXX-XXX-XXX-XXXXXXX’,  
onFormSubmit: function($form) {  
”\_gaq.push([’\_trackEvent’, ‘Contact’, ‘contact\_us\_form’, ‘Main\_Contact\_Us’, false]);"  
},  
submitButtonClass: ‘btn btn-primary btn-hubspot’,  
locale: ‘en’,  
translations: {  
en: {phoneInvalidLengthOrFormat: ‘Please enter a valid phone number.’}  
}  
});"

I have an hubspot form and i want to do that on click button, but i don’t know where is the place to paste this code p.e. “ga(‘send’, ‘event’, ‘Videos’, ‘play’, ‘Fall Campaign’);”

Thanks for your time.

---

<div class="post-metadata">

**Author:** ![Nigrinis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/nigrinis/32/74736_2.png) [@Nigrinis](https://community.hubspot.com/u/Nigrinis)\
**Post date:** [July 14, 2021, 11:44pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/5 "2021-07-14T23:44:31Z")

</div>

Hi Can you share your final code working? I can’t get to work mine… it is below:

\<!--[if lte IE 8]\>

\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2-legacy.js](https://js.hsforms.net/forms/v2-legacy.js)”\>\</script\>

\<![endif]--\>

\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2.js](https://js.hsforms.net/forms/v2.js)”\>\</script\>

\<script\>

hbspt.forms.create({

region: “na1”,

portalId: “xxx”,

formId: "dxxxf”,

onFormSubmit: function($form){

ga (‘send’, ‘event’, ‘form-submit’, ‘contact-submit’, ‘contact-us-page’)

},

});

\</script\>

---

<div class="post-metadata">

**Author:** ![Nigrinis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/nigrinis/32/74736_2.png) [@Nigrinis](https://community.hubspot.com/u/Nigrinis)\
**Post date:** [July 14, 2021, 11:37pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/6 "2021-07-14T23:37:18Z")

</div>

Hi Derek, I’m trying to replicate this in my form with no sucess… could you please add the onFormSubmit function to the below code? everytime I add it the form doesnt display… thanks a lot!

\<!--[if lte IE 8]\>

\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2-legacy.js](https://js.hsforms.net/forms/v2-legacy.js)”\>\</script\>

\<![endif]--\>

\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2.js](https://js.hsforms.net/forms/v2.js)”\>\</script\>

\<script\>

hbspt.forms.create({

region: “na1”,

portalId: “xxxx”,

formId: “xxxxx”,

});

\</script\>

---

<div class="post-metadata">

**Author:** ![Derek\_Gervais](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/derek_gervais/32/17429_2.png) [@Derek\_Gervais](https://community.hubspot.com/u/Derek_Gervais)\
**Post date:** [February 13, 2018, 7:33pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/7 "2018-02-13T19:33:40Z")

</div>

Hi [@Daniel\_Marques](https://community.hubspot.com/u/daniel_marques),

You’ll want to put that inside the `onFormSubmit` callback, where the `_gaq.push` call is now. You’ll probably also want to check out the `ga.js` to `analytics.js` migration docs, if you haven’t already:

> **[Google Analytics  |  Google for Developers](https://developers.google.com/analytics/legacy/universal-analytics)**

---

<div class="post-metadata">

**Author:** ![Jordanwywm](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jordanwywm/32/60590_2.png) [@Jordanwywm](https://community.hubspot.com/u/Jordanwywm)\
**Post date:** [July 14, 2020, 7:14am UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/8 "2020-07-14T07:14:45Z")

</div>

link broken

---

<div class="post-metadata">

**Author:** ![system](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/system/32/124_2.png) [@system](https://community.hubspot.com/u/system)\
**Post date:** [February 28, 2018, 5:37pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/9 "2018-02-28T17:37:20Z")

</div>

Hi [@Derek\_Gervais](https://community.hubspot.com/u/derek_gervais),

Could I use this to add an ga event after submission of a regular HubSpot form (not embedded) ?

Thanks !

---

<div class="post-metadata">

**Author:** ![Derek\_Gervais](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/derek_gervais/32/17429_2.png) [@Derek\_Gervais](https://community.hubspot.com/u/Derek_Gervais)\
**Post date:** [March 2, 2018, 7:53pm UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/10 "2018-03-02T19:53:26Z")

</div>

Hi [@Laurent\_Maillard](https://community.hubspot.com/u/laurent_maillard),

There isn’t currently a way to access the `onFormSubmit` callback globally or via the UI, so you’d need to either replace it with an embedded form or use a workaround like detecting the `hsvalidatedsubmit` event (see below).

dadams:

> Hi [@Arlo\_Gilbert](https://community.hubspot.com/u/arlo_gilbert) The hsvalidatedsubmit event is triggered after the data in a HubSpot form passes validation. You can detect when that event is triggered, but anything you do after detecting the event would not block the submission from proceeding. The onFormSubmit function gets executed as part of the submission itself, so anything you include in that function will be executed before the form proceeds with the submission.

---

<div class="post-metadata">

**Author:** ![scottfasser](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/scottfasser/32/31851_2.png) [@scottfasser](https://community.hubspot.com/u/scottfasser)\
**Post date:** [March 8, 2019, 12:42am UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/11 "2019-03-08T00:42:15Z")

</div>

Hi, I’m trying to trigger GA events from an embedded hubspot form as well, but it’s not working after following the instructions. Here is my form code - what have I done incorrectly?

\<!--[if lte IE 8]\>

\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2-legacy.js](https://js.hsforms.net/forms/v2-legacy.js)”\>\</script\>

\<![endif]--\>

\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2.js](https://js.hsforms.net/forms/v2.js)”\>\</script\>

\<script\>

hbspt.forms.create({

portalId: “4326424”,

formId: “106e45cd-6e1d-43b2-af21-78798a4b3e68”,

onFormSubmit: function($form){

ga (‘send’, ‘event’, ‘form-submit’, ‘contact-submit’, ‘contact-us-page’)

},

});

\</script\>

---

<div class="post-metadata">

**Author:** ![jonnoprice1](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jonnoprice1/32/57633_2.png) [@jonnoprice1](https://community.hubspot.com/u/jonnoprice1)\
**Post date:** [September 20, 2019, 10:43am UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/12 "2019-09-20T10:43:17Z")

</div>

Hi all - battling with this same issue. I really think that the better route to follow is to first implement Google Tag Manager and then republish you GA script but through GTM..  
_“Google Tag Manager is a tag management system that allows you to create and monitor tags on a user interface, without writing new code each time you want to construct a tag. You simply embed the Google Tag Manager code into each page of your website. This eliminates the manual process of creating tags, making your marketing process more efficient and precise.”_  
Once done - you will be in a much better position to track conversions in Hubspot. With GTM installed here is how you can track HS forms in GTM and GA:

> **[The Super Easy Way to Track Hubspot Forms in Google Tag Manager and Analytics...](https://analytive.com/blog/the-super-easy-way-to-track-hubspot-forms-in-google-tag-manager-and-analytics/)**
>
> Learn how to track your Hubspot forms submissions easily using Google Tag Manager and Google Analytics on your Website. Great for beginners.

---

<div class="post-metadata">

**Author:** ![juhafly](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/juhafly/32/30597_2.png) [@juhafly](https://community.hubspot.com/u/juhafly)\
**Post date:** [May 14, 2020, 7:47am UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/13 "2020-05-14T07:47:24Z")

</div>

I have followed this GTM instrucion as followed but the tag is not firing. In the trigger, I used the option to record every embedded form completion. So I used the “hbspt-form” option in the trigger which is found from the page where the form is embedded.

![26852i3945D23936641335.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/1/9/192346d4cbad7142f42de2f9c86678f87b137688.png)

Is there something that I’m missing here?

---

<div class="post-metadata">

**Author:** ![JHakkarainen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jhakkarainen/32/76793_2.png) [@JHakkarainen](https://community.hubspot.com/u/JHakkarainen)\
**Post date:** [April 6, 2021, 6:44am UTC](https://community.hubspot.com/t/trigger-google-analytics-event-with-form-submission/11370/14 "2021-04-06T06:44:38Z")

</div>

Hi,

I have a similar problem since we should embed a Google Analytics event tracking code in HubSpot form. Conversion is when a customer clicks a send button of the contact form. My question is that where is the right place for GA Event tracking code? And is this type of code the best option in this case:  
ga(‘send’, ‘event’, [[eventCategory](https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#eventCategory)], [[eventAction](https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#eventAction)], [[eventLabel](https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#eventLabel)], [[eventValue](https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#eventValue)], [fieldsObject]);

I tried the above code and replaced Category, Action and Label fields by our campaign names from Google Analytics.

Here’s the code of the HubSpot form:  
\<!--[if lte IE 8]\>  
\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2-legacy.js](https://js.hsforms.net/forms/v2-legacy.js)”\>\</script\>  
\<![endif]--\>  
\<script charset=“utf-8” type=“text/javascript” src=“[//js.hsforms.net/forms/v2.js](https://js.hsforms.net/forms/v2.js)”\>\</script\>  
\<script\>  
hbspt.forms.create({  
region: “na1”,  
portalId: “4128102”,  
formId: “3a46f667-8e71-464a-8b45-d0956e30b917”  
});  
\</script\>

Thanks a lot in advance!