How to Track Typeform Submissions Using Google Tag Manager (Step-by-Step)

April 22, 2026

If you’re using Typeform on your website, tracking submissions as conversions can be tricky—especially when the form is embedded via iframe.

Since Typeform runs on a different domain, standard GTM triggers won’t detect submissions automatically. That’s why you need a custom event listener.

In this guide, I’ll show you how to track Typeform submissions properly using Google Tag Manager.

Why Typeform Tracking Needs a Custom Solution

When a user submits a Typeform:

  • The form is hosted on form.typeform.com
  • Your website doesn’t get a native submit event
  • GTM cannot detect the submission

So without a listener, conversions are missed.

The Solution: PostMessage Event Listener

Typeform sends a postMessage event when a form is submitted.

We can listen for that event and push it into the dataLayer.

Step 1: Add the Event Listener Code

Create a Custom HTML Tag in GTM and add this code.

Trigger: All Pages or DOM Ready

window.addEventListener(‘message’, function(event) {

if (event.origin === ‘https://form.typeform.com’ && event.data.type === ‘form-submit’) {

window.dataLayer = window.dataLayer || [];

window.dataLayer.push({

event: ‘type_form_sucess_optizent’,

formId: event.data.formId

});

}

});

What This Code Does

1. Listens for Cross-Domain Messages

window.addEventListener(‘message’, function(event)

Captures messages sent from the embedded Typeform iframe.

2. Validates the Source

event.origin === ‘https://form.typeform.com’

 Ensures the message is actually coming from Typeform (important for security).

3. Detects Form Submission

event.data.type === ‘form-submit’

 Fires only when the form is successfully submitted.

4. Pushes Event to dataLayer

event: ‘type_form_sucess_optizent’

This becomes your GTM trigger.

5. Captures Form ID

formId: event.data.formId

Useful for tracking multiple Typeforms separately.

Step 2: Create GTM Trigger

Inside GTM:

  • Trigger Type → Custom Event
  • Event Name →

type_form_sucess_optizent

Step 3: Create Data Layer Variable

Create a variable:

  • Variable Type → Data Layer Variable
  • Name → formId

Step 4: Send Data to GA4

Create a GA4 Event Tag.

Example:

Event Name:

generate_lead

Event Parameters:

ParameterValue
form_id{{formId}}

Step 5: Use for Advertising Platforms

Now you can fire:

  • Google Ads Conversion Tag
  • Meta Pixel Lead Event
  • TikTok / LinkedIn conversions

Triggered only on successful Typeform submissions.

Step 6: Test Your Setup

Use GTM Preview Mode:

  1. Submit the Typeform
  2. Look for event:

type_form_sucess_optizent

  1. Verify:
  • formId is captured
  • Tags are firing

Common Mistakes to Avoid

  • Wrong event name in GTM trigger
  • Not embedding Typeform correctly
  • Missing dataLayer variable
  • Not checking event.origin (security risk)

Pro Tips

Track Multiple Forms

Use conditions like:

formId equals abc123

Improve Attribution

Send additional parameters like:

  • Page URL
  • Traffic source

Final Thoughts

Tracking Typeform submissions requires a bit of custom setup—but once implemented, it becomes a reliable conversion signal.

With this method, you:

  • Capture accurate form submissions
  • Send clean data to analytics tools
  • Improve ad performance tracking

And most importantly—you stop losing conversions.