Type Form Event Listener

It is easy and possible to track conversions of embedded Typeform forms using Google Tag Manager and the Typeform successful form submission event listener. Utilize this conversion data to enhance your marketing efforts in your analytics and advertising platform.

How to track Typeform Submissions with google tag manager

Elevate your marketing insights with Typeform conversion data. Use embedded Typeform forms for audience engagement and lead generation. You can easily track successful form submissions as conversions and form step changes as interactions using Google Tag Manager (GTM) and this Typeform event listener code.

Begin by creating a custom HTML tag type where you can conveniently paste the listener code. Once implemented, the code generates a dataLayer event when a user successfully submits a Typeform form with the event name [typeform_submitted].

When a user proceeds or goes back to a different step in a form, an event named [typeform_step_change] is triggered.

To enable the firing of your marketing tags/pixels, you need to create two custom event triggers using the conversion and step change event names:

  • [typeform_submitted] -> For successful form submissions
  • [typeform_step_change] -> for when the form step changes.

To further narrow down your trigger conditions or capture form details such as form ID and form step reference ID, you can use the following dataLayer variables as event parameters:

  • [typeFormID] ->which returns the Typeform form ID
  • [stepReference] ->which returns the step reference in the form.

You can now include triggers and parameters in your event tag for Google Analytics, Piwik Pro, Mixpanel, and other platforms.


Credit: Code initially created by Codeandtonic (we only modified the code)

var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

// Listen to message from child window
eventer(messageEvent,function(e) {
var key = e.message ? "message" : "data";
var data = e[key];

if(data.type == "form-submit"){
console.log("???? Typeform Conversion detected!")
window.dataLayer = window.dataLayer || [];
'event': 'typeform_submitted',
'typeFormID': data.formId

else if (data.type == "form-screen-changed") {
console.log("???? Typeform Step Changed!")
window.dataLayer = window.dataLayer || [];
'event': 'typeform_step_change',
'typeFormID': data.formId,
'stepReference': data.ref


Video of how to use the listener

Related Event Listener

Formidable Form

Detect the successful submission of your Formidable forms, and use it as a trigger for your marketing pixels.

ConvertKit Form

Measure your Convertkit form submission as conversions and fire your marketing tags/pixels on conversion.

Web Engage

You can measure conversion and user interactions with Web Engage in your analytics tools.

download the google tag manager recipe for tracking Typeform Submissions

we make you smarter with data

made with ❤️

The DumbData Team