How to Track HubSpot Form Submissions with Google Tag Manager

What we’re going to build

HubSpot’s updated forms emit a browser event after a submission succeeds. We’ll listen for that event and translate it into a clean GTM data layer event:

{
  event: "hubspotFormSubmit",
  formId: "abc123",
  formData: [
    { name: "0-1/email", value: "test@example.com" }
  ]
}

The key property is event: "hubspotFormSubmit". Google Tag Manager can listen for that event and use it as a reusable conversion trigger.

Add the current HubSpot success listener to GTM

In Google Tag Manager, open Tags → New → Tag Configuration → Custom HTML and paste this listener:

<script>
window.addEventListener(
  'hs-form-event:on-submission:success',
  async function(event) {
    var form = window.HubSpotFormsV4.getFormFromEvent(event);
    var formData = await form.getFormFieldValues();

    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({
      event: 'hubspotFormSubmit',
      formId: event.detail.formId,
      formData: formData
    });
  }
);
</script>

If HubSpot forms appear throughout your website, use All Pages. Otherwise, limit the listener to the relevant pages, then save the tag.

<script>
window.addEventListener('message', function(event) {
  if (
    event.data &&
    event.data.type === 'hsFormCallback' &&
    event.data.eventName === 'onFormSubmit'
  ) {
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({
      event: 'hubspotFormSubmit',
      formId: event.data.id,
      formData: event.data.data
    });
  }
});
</script>

HubSpot documents the current and legacy approaches separately. Use the listener that matches the form actually embedded on your site.

Understand the script

Listen for a successful submission

window.addEventListener(
  'hs-form-event:on-submission:success',
  async function(event) {
    // Runs only after HubSpot reports success
  }
);

This event is emitted after HubSpot confirms that the updated form was submitted successfully.

Read the submitted fields

var form = window.HubSpotFormsV4.getFormFromEvent(event);
var formData = await form.getFormFieldValues();

HubSpot’s form instance API returns the fields as an array of name-and-value objects.

Push the standardized event

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  event: 'hubspotFormSubmit',
  formId: event.detail.formId,
  formData: formData
});

This initializes the data layer when necessary and makes the successful submission available to GTM.

Test the HubSpot form submission

Click Preview in GTM, connect Tag Assistant to your website, and open a page containing the HubSpot form. Complete a test submission, then return to the GTM event timeline.

You should see hubspotFormSubmit. Select it and inspect the Data Layer tab for the event and formData.

{
  event: "hubspotFormSubmit",
  formId: "abc123",
  formData: [
    { name: "0-1/email", value: "test@example.com" }
  ]
}

Use test information rather than real customer data while debugging.

Create a HubSpot Custom Event trigger

Go to Triggers → New → Trigger Configuration and select Custom Event. Enter hubspotFormSubmit as the event name and choose All Custom Events.

Save the trigger. It now represents the HubSpot submission inside your container.

Use the submission as a conversion trigger

Attach the trigger to the appropriate GA4, Google Ads, Meta, LinkedIn, TikTok, Microsoft Ads, or other conversion tag.

A button click can fire even when validation fails. The success event gives you a more meaningful signal because HubSpot emits it after a successful submission.

Access the submitted HubSpot form data

The listener gets HubSpot’s submitted fields with getFormFieldValues() and pushes the result as formData. To inspect the full value in GTM, create a Data Layer Variable:

Current HubSpot forms can return names such as 0-1/email, while legacy forms may use email. Inspect the real structure in Preview Mode before creating variables for individual fields.

Extract an individual field such as email

If Preview Mode shows email as the first array item, formData.0.value may appear to work—but field order can change between forms. Do not assume email will always occupy the same position.

A Custom JavaScript Variable can search for the field by name instead:

function() {
  var formData = {{DLV - HubSpot Form Data}};
  if (!formData || !formData.length) {
    return;
  }

  for (var i = 0; i < formData.length; i++) {
    if (
      formData[i].name === 'email' ||
      formData[i].name.slice(-6) === '/email'
    ) {
      return formData[i].value;
    }
  }
}

Name it CJS - HubSpot Email. The same pattern can find firstname, lastname, phone, or company when you have a valid reason to use those values.

Track specific HubSpot forms

A contact form, newsletter signup, demo request, and pricing request should not necessarily count as the same conversion. HubSpot’s current event exposes a stable form identifier at event.detail.formId:

var formId = event.detail.formId;

window.dataLayer.push({
  event: 'hubspotFormSubmit',
  formId: formId,
  formData: formData
});

Create a Data Layer Variable for formId, then restrict your Custom Event trigger:

For a legacy form, confirm the actual callback property in Preview Mode before relying on event.data.id.

Troubleshooting HubSpot form tracking

Confirm that the listener fired

In Preview Mode, make sure the Custom HTML listener appears under the tags that fired on the form page.

Confirm which HubSpot form generation you use

Updated forms use hs-form-event:on-submission:success. Legacy embedded forms may use the hsFormCallback message. Another provider—or a HubSpot form inside an iframe you do not control—may require a different approach.

Complete a valid submission

Validation failures and incomplete required fields can prevent the expected callback.

Inspect formData before creating variables

Do not guess the array order or property names. Use the submitted event in Preview Mode as the source of truth.

Separate listener problems from tag problems

If hubspotFormSubmit appears but the final conversion tag does not fire, inspect the GTM trigger and tag configuration next.