Google Tag Manager
February 28, 2025

How to Track HubSpot Form Submissions in Google Ads & GA4 (Step-by-Step Guide)

If you use HubSpot to track form submissions, you may have encountered issues when trying to track those submissions in Google Ads or Google Analytics 4 (GA4). Unlike traditional forms that redirect users to a thank-you page, HubSpot forms often display an inline “thank you” message, making them harder to track using standard methods.

In this guide, I’ll walk you through how to set up tracking for HubSpot form submissions using Google Tag Manager (GTM) and a little bit of JavaScript. By the end of this tutorial, you’ll be able to track form submissions in GA4, Google Ads, and other marketing platforms – even if your HubSpot forms are embedded as an iframe!

Video Tutorial

If you prefer learning by watching, here is a video with this same overview. If you have not yet, consider subscribing to stay up-to-date on all things analytics.

Why Can’t HubSpot Form Submissions Be Tracked Easily?

If you’ve tried tracking HubSpot form submissions, you may have noticed that they don’t trigger a form submit event in GTM. This happens because:

Most HubSpot forms do not redirect to a thank-you page. Instead, they show an inline success message.
HubSpot forms are often embedded as iframes. Since an iframe is essentially a “website inside another website,” GTM cannot access events inside it by default.
No default GA4 or Google Ads events fire on form submission. This means standard GTM form tracking won’t work.

Thankfully, there’s a solution! Let’s go step by step to enable tracking for HubSpot forms using GTM.

Step 1: Create a HubSpot Form Check Variable in GTM

First, we need to check if a HubSpot form is present on a page. To do this:

Open Google Tag Manager (GTM) and navigate to Variables.
Create a New Variable called HubSpot Form Check.
Use the following JavaScript to check if a HubSpot form is on the page:

Download from my GitHub

 function() {
 
  if ( document.querySelectorAll('.hbspt-form').length > 0 ) {
    
   return true; 
    
  }
    
}

Save the variable.

This variable will return true if a HubSpot form exists on the page, allowing us to trigger our tracking only when needed.

Step 2: Create a Trigger for HubSpot Forms

Now, let’s create a trigger that fires only when a HubSpot form is detected.

In GTM, go to Triggers and create a New Trigger.
Name it HubSpot Form Page View.
Choose Page View as the trigger type.
Select Some Page Views and set the condition:
- HubSpot Form Check equals true

This ensures that the tracking code will only fire on pages containing a HubSpot form.

Step 3: Add a JavaScript Event Listener for HubSpot Forms

Since HubSpot forms don’t trigger a standard form submission event, we need to listen for form submissions manually using an event listener.

1. In GTM, go to Tags and create a New Tag.
2. Name it HubSpot Form Listener.
3. Choose Custom HTML as the tag type.
4. Paste the following JavaScript code inside the tag: Download from my GitHub

<script>
  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>

Step 4: Create a Data Layer Variable for Form ID

To differentiate between multiple HubSpot forms, let’s capture the form ID.

In GTM, go to Variables and click New.
Name it HubSpot Form ID.
Set the variable type to Data Layer Variable.
Set the Data Layer Variable Name to formID.
Save the variable.

This allows us to track which specific HubSpot form was submitted, which is useful if you have multiple forms on your site.

Step 5: Create a Trigger for Form Submissions

Next, let’s create a trigger that listens for the HubSpot form submission event.

In GTM, go to Triggers and create a New Trigger.
Name it HubSpot Form Submission.
Choose Custom Event as the trigger type.
Set the Event Name to hubspot_form_success.
If you have multiple forms, add a condition:
- HubSpot Form ID equals [Your Form’s Unique ID]

Now, this trigger will fire only when a HubSpot form submission event occurs.

Step 6: Send Data to Google Analytics 4 (GA4) & Google Ads

Now that we have tracking set up, let’s send the data to GA4 and Google Ads.

For GA4 Event Tracking:

In GTM, create a New Tag.
Name it GA4 HubSpot Form Submission.
Choose Google Analytics: GA4 Event as the tag type.
Select your GA4 Configuration Tag.
Set the Event Name to hubspot_form_submit.
Under Event Parameters, add:
- form_id = {{HubSpot Form ID}}
Set the Trigger to HubSpot Form Submission.
Save and publish.

For Google Ads Conversion Tracking:

Create another New Tag.
Name it Google Ads HubSpot Form Submission.
Choose Google Ads Conversion Tracking as the tag type.
Enter your Conversion ID and Conversion Label (from Google Ads).
Set the Trigger to HubSpot Form Submission.
Save and publish.

Final Step: Testing Your Setup

Before going live, always test your tracking setup using Google Tag Assistant:

Open GTM Preview Mode and visit a page with a HubSpot form.
Submit the form and check if the hubspot_form_success event appears in the data layer.
Verify that your GA4 and Google Ads tags fire correctly.
If everything works, publish your changes in GTM.

Conclusion

Tracking HubSpot form submissions in Google Ads and GA4 isn’t straightforward, but with Google Tag Manager and a custom script, you can accurately track form submissions and optimize your campaigns.

If you found this guide helpful, feel free to share it, leave a comment, or ask questions below!