hubspot form Event Listener

Enhance your marketing data with this event listener, which makes it easy to listen to successful Hubspot form submissions and track them as conversions in analytics (Google Analytics, Mixpanel, Facebook, Google Ads, etc.) using Google Tag Manager.

How to track hubspot form submission with google tag manager

To track Hubspot form conversions with Google Tag Manager, all you’ll have to do is copy the event listener code and paste it into your custom HTML tag in GTM, trigger it on pageview.

Next, you’ll have to navigate to triggers to create a custom event trigger type [hubspot-form-success] which will be used to fire your marketing tags/pixels such as Google Analytics, Facebook Pixels, Mixpanel, Piwik Pro, etc.

Also, ensure your implementation is privacy compliant. Using trigger conditions in Google Tag Manager, you can streamline your conversion to be recorded on certain pages, form IDs or user types.

One thing to note is that an event gets triggered before the Hubspot form is successfully submitted, the event name is [hubspot-form-data].

This event gets all the form field data captured in the form and can be used on the successful form submission event [hubspot-form-success] to enrich your data.

Pro Tip: To access the data fields, create a datalayer variable.

 

? Credit:

3WhiteHats Initially Created This Code (we made modifications to capture the form data)

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

Video of how to use the listener

Related Event Listener

gravity form event listener

Gravity Form

Capture your Gravity form conversions as they happen in a dataLayer format which can be used in GTM to trigger marketing tags.
contact form 7 listener

Contact Form 7

Contact Form 7 event listener that helps you measure successful submission in GTM for easy triggering of conversion pixels.
mailchimp for wordpress event listener

Mailchimp 4 WP

Using the Mailchimp For WordPress Plugin by Ibericode, then you can use this event listener to capture conversions.

download the google tag manager recipe for tracking hubspot form submission

we make you smarter with data

made with ❤️

The DumbData Team
Before you leave, try out these free tools.
FREE GA4 AUDIT TOOL & UTM AUDIT TOOL