Tracking Events & Form Submissions with Google Tag Manager in Smart Builder

Follow

Google Tag Manager (GTM) is a tool that allows you to quickly and easily adjust tracking and marketing automation scripts for your pages from one centralized place. You can set up triggers to send information to different tools such as Google Analytics, Google Ads Conversion Tracking, and more.

At this time, you can only use the Google Tag Manager App in Smart Builder to send events to GTM.

To track form submission events (via the Form Submission Trigger in GTM), you will need to use Script Manager, as explained in later sections of this doc. 

This article will explain either option:

Adding GTM tracking to your page in Smart Builder to track standard events, or

How to set up GTM with Script Manager to track form submissions events 

Working in the Classic Builder?

To track form submissions with GTM for your Classic Builder pages, see this article: How Do I Integrate Google Tag Manager With Unbounce for Classic Builder Pages? 

Adding the Google Tag Manager App to Smart Builder (to track events only)

Follow these steps to set up GTM on your Smart Builder page, to track custom events. You can use this App to send events (e.g., link clicks, button clicks, etc.) to Google Tag Manager.

Note:

Currently, the GTM App for Smart Builder does not support the Form Submission trigger. See the next section of this article for a workaround on sending form submission events through to GTM.

  1. Navigate to the Apps  tab within the left-hand side of the menu at the top of Smart Builder.
  2. Search and locate the Google Tag Manager App.
  3. Click the plus button next to Google Tag Manager to install the App.
  4. A new page will appear on the left-hand side menu. In the blank field that appears, input your unique Google Tag Manager tracking ID:
    Field in Smart Builder sidebar to paste in GTM script.

And that's it! Be sure to Save and Publish your landing page to finalize these changes. 

Updating the Google Tag Manager Container ID

If you need to change your GTM tracking ID at any time, follow these steps:

  1. Navigate to the Apps  tab within the left-hand side of the menu at the top of Smart Builder.
  2. Scroll down to the Installed Apps section.
  3. Click the gear  icon next to the Google Tag Manager App; the app settings will reappear. 
  4. Update the tracking ID as needed.  

If you require help with Google Tag Manager, check out Tag Manager Help below: Google Tag Manager Help Center.

Tracking Form Submission Events for Smart Builder Pages

Use this installation setup to track form submission events in Smart Builder. 

If you need to use GTM's Form Submission trigger to track form submission events, you can utilize Unbounce's Script Manager.  

Script Manager allows you to add custom scripts to landing pages linked to a specific domain. 

The web installation code includes two code snippets:
Two code snippets with GTM scripts enclosed.

Step One: Adding the GTM Web Installation Code to Unbounce

  1. From the left-hand side menu of the Unbounce Conversion Intelligenceâ„¢ Platform, click Settings
  2. From the drop-down menu, select Script Manager
  3. Click the blue Add a Script button on the top-right-hand corner. 
  4. From the Add a Script window, select a Custom Script from the drop-down menu:Annotated image of steps to adding a custom script.
  5. Provide your script a name, such as "GTM Smart Builder," and click Add Script Details. 
  6. Two panels will appear; update the fields with the following values: 
    • Within the Script Details tab, set the Placement to the Head, and the Included on value to Main Landing Page.
    • Paste the first part of the web installation code within this dialog box (the '<script>' code).
    • In the Script Usage tab, select which domains(s) of your Smart Builder page you'd like to track form submissions via GTM with.
  7. Click Save & Publish Script to finalize these changes. Here is an example: 
    GTM script in Script Manager.
  8. Next, follow steps 1-4 above to create another custom script. 
  9. This time, in the two panels that appear; update the fields with the following values: 
    • Within the Script Details tab, set the Placement to the After Body Tag, and the Included on value to Main Landing Page.
    • Paste the second part of the web installation code within this dialog box (the '<noscript>' code).
    • In the Script Usage tab, select which domains(s) of your Smart Builder page you'd like to track form submissions via GTM with.
  10. Click Save & Publish Script to finalize these changes; here is an example of the second script: 
    GTM script in Script Manager.

You should now have two custom scripts in Script Manager for GTM:

A list of two custom scripts in Script Manager for GTM.

Step Two: Creating the Tags & Triggers in GTM

Once you've added the GTM tracking script to your Smart Builder pages, create a tag in GTM.

For example, if you'd like to report form submission events to Google Ads Conversion Tracking, choose the Google Ads Conversion Tracking tag type:

Annotated image of a Tag setup settings in GTM, with a red box around the different pre-built tag options.

Once you've added/created your tag, create a new trigger.

From the trigger type, select the Form Submission trigger: 

Annotated image of a Trigger setup settings in GTM, with a red box around the 'Form Submission' trigger.

Be sure to save your GTM container, and you're all set!

To preview and test if the trigger is firing from your landing page, you can test your page directly in GTM with the Tag Assistant.