HubSpot Form Submissions Tracking Using Google Tag Manager

Tracking form submissions is essential for understanding user behavior and measuring conversions. In this guide, I’ll walk you through a simple and effective way to track HubSpot form submissions using Google Tag Manager (GTM) and push the data into the data layer.

Step 1: Create a HubSpot Form Submit Listener Tag

First, we need to listen for HubSpot form submission events using a custom HTML tag.

  • Go to Tags in GTM
  • Click New
  • Name it: Hubspot – Form Submit Listener
  • Select Custom HTML

Paste the following code:

<script type="text/javascript">
  window.addEventListener("message", function(event) {
    if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
      window.dataLayer.push({
        'event': 'hubspot-form-submit',
        'hs-form-guid': event.data.id
      });
    }
  });
</script>
  • Set the trigger to All Pages

This script listens for HubSpot form submission events and pushes them into the data layer.

Step 2: Create a Custom Event Trigger

Next, create a trigger that listens for the event we just pushed.

  • Go to Triggers
  • Click New
  • Name it: HS Form Submission
  • Choose Custom Event
  • Event Name: hubspot-form-submit

This trigger will fire whenever a HubSpot form is successfully submitted.

Step 3: Create a Data Layer Variable

We now extract the form ID from the data layer.

  • Go to Variables
  • Click New
  • Name it: HS Form ID
  • Variable Type: Data Layer Variable
  • Data Layer Variable Name: hs-form-guid

This variable captures the unique identifier of the submitted HubSpot form.

Step 4: Create the Final Tracking Tag

Now, send the form submission data to your analytics platform (e.g., GA4).

  • Go to Tags
  • Click New
  • Name it: Contact Form Submission

Configuration:

  • Event Name: hs_form_submission
  • Parameter Name: hs_form_id
  • Parameter Value: {{HS Form ID}}
  • Trigger: HS Form Submission

Optional:

  • Parameter Name: page_path
  • Parameter Value: {{Page Path}}

This allows you to track where the form was submitted from.

Conclusion

By following these steps, you can successfully track HubSpot form submissions using Google Tag Manager. This setup gives you:

  • Accurate form submission tracking
  • Access to form IDs for deeper analysis
  • Flexibility to send data to GA4 or other tools

This method is lightweight, scalable, and works across all HubSpot embedded forms without modifying the form itself.

Tip: Always test your setup using GTM Preview mode before publishing changes.

Related Posts