You’re invited to Typeforum 2024! 📣

Register now
Signup

Add Google Tag Manager to a form

Google Tag Manager is a free tool that allows you to add or change tracking on a website or application without needing to rely on development resources. Now, you can also use it with your forms.

What you need:

  • A Business Typeform account
  • A Google Tag Manager account

What is Google Tag Manager?

This is a free application that manages various tracking tools, primarily designed for professional marketers. Instead of having to add tracking tools to your website one by one, which means changing code, you can install Google Tag Manager once, and then add any tracking tools you like to it.

How to add Google Tag Manager to your forms

1. Open Tag Manager, and copy your Google Tag Manager Container ID to your clipboard (Ctrl+C). It will appear at the top of the window and will be formatted like this: GTM-XXXXXX. 

2024-04-12_17-34-26.png

2. Open your Typeform Workspace, and find the form you want to track. Open the form.2024-04-12_17-25-29.png

3. Click on the Connect tab. Scroll until you see the Google Tag Manager integration, or search "Google Tag Manager" in the search bar. Click Connect.

2024-04-12_17-26-49.png

4. A new page will appear, asking you to paste in your Google Tag Manager Container ID. 

gtm1.png

5. Click Save, and you’re now ready to track using Tag Manager.

6. If you want to edit the integration or remove tracking altogether, you can click the three-dot button on the right-hand side of the active integration:

gtm2.png

HC_Warning_ilu_cropped.png
Warning! Please note that it is currently not possible to use Google Tag Manager if you have a Payment field in your form.

Set up Google Tags for tracking your form

Simply adding Tag Manager to your form won’t do anything until you’ve set it up. Here’s a simple example of the process – adding Facebook Pixel to Tag manager. For more on setting up Tag Manager, see Google’s documentation.

1. To create a tag, click Add a new tag.

2024-04-12_17-34-26.png

2. Now a configuration menu will appear.

3. Click anywhere on Tag Configuration to bring up the tag type menu. You can choose from all kinds of Google products, including Analytics, plus many ready-made tags for other tracking software.

Facebook Pixel is not included, so we need to choose Custom HTML.

4. Now grab your Facebook Pixel code from the Events Manager in Facebook (here’s where to find it). Paste this code into the configuration field, as shown below, and then it’s time to set up your triggers.

5. Click the Triggering field to open up the Choose a trigger menu. We’ll go for Page View as an example. Click that to be taken back to the tag configuration interface.

6. Now hit Save. Pixel is now included in Tag Manager, so you’ll be able to track your form’s page views (in this example) from Facebook Events Manager.

The events tracked are the following: “TypeformFirstInteraction” when the respondent clicks the Welcome Screen (if the form has one) or answers the form's first question (if there is no Welcome Screen), and “TypeformSubmit” when the request to the submission is valid.

Insecure domains

We block insecure domains that are not 'https'. If you have an active form connected to an insecure (http) domain, including any resources like images or custom fonts that have been added through Google Tag Manager, your form may not work properly.

 

HC_Note_new.png
Note! Embedded forms won't work if your cookies aren't set up correctly. You can find some tips about how to set up your cookies the right way here and here.

Tap into our community knowledge