How do I track Hubspot forms with Google Tag Manager?

When a Hubspot form has been successfully validated, Hubspot triggers an event that can be followed to trigger Google Tag Manager tags.

We are going to see how to create a custom HTML tag that monitors these Hubspot form conversions and then trigger a conversion marketing tag.

Custom HTML tag for monitoring Hubspot forms

Create a tag Custom HTML, paste the code below into the tag script and use “all pages” as a trigger.

GTM-hubspot-tracking-tag

 

Here is the custom HTML code to paste into the tag

<script type = “text/javascript">window. addEventListener (“message”, function (event) {if (event. data. type === 'hsformCallback'&& event.data.eventName === 'onFormSubmitted') {'onFormSubmitted') {window.dataLayer.push ({'event': 'hubspot-form-success', 'hs-form-guid': event.data.id '</script>: event.data.id});}});

Trigger “Hubspot form successfully submitted”

Create a new trigger for the data layer event triggered by the event listener. This trigger is used to track Hubspot forms that have been successfully submitted.

gtm-hubspot-tracking-success-form

Tag linked to the conversion on a validated Hubspot form

Finally create your tag corresponding to the conversion linked to the Hubspot form.

For Appvizer, it will be an HTML tag with the conversion script and to trigger the Custom Event above (Hubspot form success).