How-To Guides

Google Tag Manager: Tracking Form Submissions

Form Submission Tracking in GTM

As we know by now, Google Tag Manager is a very powerful tool that enables marketers and web developers to tag actions on a website in a single web-based interface. One of the most common actions that a marketer needs to tag is the submission of a form. Whether the form only collects email addresses for newsletter signups, or it is a multi-step form used for booking an appointment, Google Tag Manager can easily help you track submissions. Before you get started, here are some words to the wise:

  • Many forms are coded differently, so there is no one-size-fits-all solution for tracking them in GTM.

  • Be prepared for plenty of trial and error in Tag Assistant and your browser's developer tools.

  • Resist the temptation to build your trigger on "all form submissions" and clicks to the submit button.

 

Trigger-Building Scenarios to consider

As mentioned above, many forms are coded differently, and we'd need to use different triggers in order to cover different scenarios. When determining the proper trigger to use in order to track your form, be sure to ask yourself the below questions, and follow the handy flow-chart we put together

  1. Does the form consist of a proper <form> HTML element that generates a submit event?

    1. YES - use a Form Submission trigger

    2. NO - proceed to question 2.

  2. Does a successful form submission take the user to a thank you page, or is there a thank you message displayed on the same page?

    1. Thank you page - proceed to question 3

    2. Thank you message - use an Element Visibility trigger

  3. Is the thank you page shared by multiple forms on the site?

    1. YES - use a Page View trigger, but specify referrer page URL

    2. NO - use a Page View trigger. Referrer is not necessary in this case.

  4. Is the form an AJAX form (ask your developer)?

    1. YES - test an Element Visibility trigger, but if it does not work, you can install the AJAX listener code from Bounteous

    2. NO - proceed to question 5

  5. Does the form reside inside an <iframe> tag? **PLEASE GOD, NO!**

    1. YES - Work with the owner of the <iframe> to see if GTM or individual tracking tags can be placed or if a successful submission can be redirected to a non-iframe thank you page. If the latter is possible, return to question 3.

    2. NO - Work with developer to safely alter/remove any tags or scripts preventing a successful submission event from being sent to GTM.

 

This guide should help you figure out which is the appropriate trigger for tracking your form in most cases.

The below examples are for illustrative purposes only and are not necessarily websites we have worked on.

Scenario 1: Proper <form> element that generates submit event

This is the ideal situation. What would make this situation perfect is if the form element has a static, but unique ID attribute. If there is no ID, or the ID is randomly generated for each user, then it's best to use another variable or combination of variables. Class is an acceptable attribute to use if you are hoping to track multiple similar forms on your site, but do not need to track them independently from each other. Sometimes, certain CMS platforms or form builders create unique attributes for each form that can be captured as a custom variable in GTM.

 

This form has an id value of sales-form.

 

When building your Form Submit trigger, always filter and never use "all form submissions." Some tags (i.e. the Facebook pixel, other site code) send form submission events on every page load and would send false positives to whatever conversion tag uses said trigger.

In this example, we’d use a trigger where Form ID equals sales-form.

Trigger to use: Form Submit

Trigger fires when (depending on your specific scenario):

  • ID equals …

  • Class equals…

  • Class equals… AND Page Path equals…

 

Scenario 2: Unique thank you page URL

This is another good situation. For each form that gets submitted, the user gets redirected to a thank you page unique to that form. This is a simple trigger to build, and great if you need to track multiple forms separately from each other.

 

 

This is a clean solution, but if you have many different forms, each redirecting to a different thank you page, it can get a bit unruly to manage.

 

thank-you-page-trigger.png

Trigger to use: Page View

Trigger fires when (depending on your specific scenario):

  • Page Path or Page URL equals…

  • Page Path or Page URL equals… AND Referrer starts with…


Scenario 3: Shared thank you page URL

This is perhaps the simplest trigger to build, but beware - it may result in false positives if multiple different forms that need to be tracked separately redirect to the same thank you page. We had a client who has two different forms that represent two very different conversions. The first form always redirected users to a thank you page after a successful submission, and the second form would display a thank you message. Then one day, they began redirecting successful submissions of the second form to the same thank you page as the first form. Because they had originally built their trigger for all views of this thank you page, they were double-counting and recording lots of false positives for each conversion.

 

Trigger to use: Page View

Trigger fires when (depending on your specific scenario):

  • Page Path or Page URL equals…

  • Page Path or Page URL equals… AND Referrer starts with…

 

Scenario 4: Thank you message

Sometimes there are instances where a form submission does not send Google Tag Manager a gtm.formSubmit event, and it does not redirect to a thank you page, but a thank you message does appear. In this case, it would actually be ideal for you to work with your developer to have a custom event pushed to the data layer upon a successful form submission. If that is not possible, then we can sometimes build a trigger based upon when the thank you message shows up. We just have to find the element that the thank you message is contained within in order to build our trigger.

Some forms display a simple thank you message. We can use the element visibility trigger to detect a submission in this case.

The ID (starting with yui_3…) might change for each form submission in this particular CMS, so we will use the class (form-submisison-text) in this case.

We will use the CSS Selector method and call the form-submission-text class value by preceding it with a dot (.).

We will use the CSS Selector method and call the form-submission-text class value by preceding it with a dot (.).

 

Trigger to use: Element Visibility

Trigger fires when (depending on your specific scenario):

  • ID equals…

  • CSS Selector equals… AND Page Path equals

 

Scenario 5: Ajax form

The form displays a thank you message, but the element visible trigger isn't working. It's possible that this is an AJAX form. GTM still does not natively support AJAX form tracking, but Bounteous has created a great solution that is free for everyone to use. The code itself is highly technical, but you just need to copy & paste and follow a few steps as outlined on Analytics Mania's blog:

 

  1. Create a new blank HTML tag, and set it to fire on all pages

  2. In Tag Assistant, submit a form

  3. Look for the 'ajaxComplete' message on the left-hand side of Tag Assistant. If it's there, click on it. If not, then work with your developer to determine the best way to track this form.

  4. Click Data Layer

  5. Look for "response" inside the attributes node of the data layer

  6. Create a Variable

    1. Type = Data Layer variable

    2. Data Layer Variable Name = attributes.response

  7. Build your trigger

 

Trigger to use: Custom Event

Trigger fires when (depending on your specific scenario):

  • Event Name = ajaxComplete

    • Select "Some Custom Events"

    • attributes.response contains [success message above]

 

How do I QA my form trigger in GTM?

In Google Tag Manager, go to Tag Assistant by clicking the Preview button near the top-right of the interface. Then enter the URL of a page with the form that you would like to track in Tag Assistant, and then submit the form on the site. Did your tag show up in the “Tags Fired” section? If so, then your form trigger works. If not, then you may need to go back and review the above steps and try to refine your trigger. Always look at the variables tab in Tag Assistant for additional attributes to try to use in building your trigger. Also make sure that if your condition uses "equals," that your attribute appears exactly in GTM as it does in the site code.

 

tag-assistant-form-submit.png

If you need help with implementing form tracking or updating your entire Google Tag Manager container, don't hesitate to contact us via the chat or the form below. We do full GTM audits, implementations, and customizations.

UTM Paramaters: How to Build Tracking URLs with UTM Codes | Free URL Builder Tool Download

Measurement & Tracking Codes

Famous consultant and author Peter Drucker once said "If you can't measure it, you can't improve it." The great thing about digital marketing is that most activities are measurable, and thus can be optimized and improved in near real-time. How we go about measurement is through the wonder of tracking codes. The most common variation of the tracking code is the UTM parameter.

 

What are UTM parameters

Have you ever looked in Google Analytics, only to see that a large portion of your traffic comes from the "Other" channel, or that your best-performing paid social campaign is "(not set)?" If so, then you need to start using UTM parameters like yesterday! UTM parameters, or UTM codes, are snippets of text appended to a URL that allow you attribute performance to specific segments of traffic. A segment of traffic can be as broad as an entire search engine (i.e. Google) or as narrow as a single keyword (i.e. baby shoes). These UTM parameters get added to the end of the URL and are ultimately read by Google Analytics and a number of other analytics systems and CRMs.

“Other” is the highest traffic-generating channel in this account.

Looks like the campaign name needs to be added to the URL for this paid social traffic.

Looks like the campaign name needs to be added to the URL for this paid social traffic.

 

How do UTM parameters work?

When appended to the end of a URL, the values in each UTM parameter are written to fields in Google Analytics that answer the question "where did this traffic come from?" Each UTM parameter (as does any URL parameter) follows the basic syntax parameter_name=value. The five UTM parameters are as follows:

 

Source (utm_source)

The originating source of the traffic. This is most commonly used to describe the website or channel that sent traffic to the URL that you are tracking. Some common examples of source values are google, facebook, bing, and cnn.com. At the end of the URL, the source will be sent in a parameter called utm_source.

Examples:

  • utm_source=facebook

  • utm_source=twitter

  • utm_source=google

  • utm_source=mailchimp

 

Medium (utm_medium)

The medium used to deliver the traffic. This is most commonly used to describe the grouping of websites that sent traffic to the URL that you are tracking. Some common examples of medium values are cpc, cpm, paid_social, referral, email. At the end of the URL, the medium will be sent in a parameter called utm_medium.

Examples:

  • utm_medium=cpc

  • utm_medium=paid_social

  • utm_medium=referral

 

Campaign (utm_campaign)

The name of the campaign or current initiative that this traffic is part of. This can be used either to describe a literal campaign in your paid search, paid social, or programmatic display account, or it can be used to describe a larger company initiative. How it is used should depend on the preference of whomever is the primary user of Google Analytics. If a paid search manager is the primary user of Google Analytics for his e-commerce account, then it's best for him to populate the campaign parameter with each paid search campaign name (i.e. Non-Brand_Shoes_Baby_Exact). If a marketing director is the primary user of Google Analytics, and she wants to get a high-level look at performance without getting too granular, then she may choose to populate the name of a current company initiative (i.e. Promo_Spring2021) in the campaign parameter. At the end of the URL, the campaign will be sent in a parameter called utm_campaign.

Examples:

  • utm_campaign=Non-Brand_Shoes_Baby_Exact

  • utm_campaign=Promo_Spring2021

  • utm_campaign=IG_SiteRetargeting

 

Content (utm_content)

A description of or identifier associated with an ad, email, newsletter link, video, or any content that may send traffic to the URL that you are tracking. This is a good place to put your email subject line or a specific button click within an email. When using Google Ads auto-tagging, Google automatically sends Headline 1 as the content value. If you're not using auto-tagging, you could have Google (or Bing) send the ad's ID to Google Analytics, and you can look up headlines and descriptions for each ad ID in a database or spreadsheet. There are many uses for the content parameter, so you'll have to determine what is best for you. At the end of the URL, the content will be sent in a parameter called utm_content.

Examples:

  • utm_content=March2021_50offSale

  • utm_content=tweet_how-to-fix-anything-with-duct-tape

  • utm_content=ad23438485871

 

Keyword (utm_term)

This parameter is used in paid search to show which keyword triggered the ad that was clicked on that brought the user to the URL that you're tracking.

Examples:

  • utm_term=lake%20house%20rental

  • utm_term=hockey%20mask

  • utm_term=chainsaw%20rental

  

Putting it all together

Each URL must follow the above syntax in order to function properly. Here is couple scenario that will help illustrate how to properly create a URL that attributes traffic to the UTM parameters that you set.

 

Scenario

You have a week-long 25% off seasonal promotion where you're driving traffic to a special promo page on mytotallyawesomesite.com primarily through email sent via Active Campaign and social media. You send two versions an email in order to A/B test subject lines, post once to Twitter, and post once to Facebook to support the promotion. In order to track how each of these activities performed, we would implement the following tracking URLs:

Email

  • Email 1: https://www.mytotallyawesomesite.com/25offpromo?utm_source=activecampaign&utm_medium=email&utm_campaign=Feb2021_25Off&utm_content=25Off_SaveBig

  •  Email 2: https://www.mytotallyawesomesite.com/25offpromo?utm_source=activecampaign&utm_medium=email&utm_campaign=Feb2021_25Off&utm_content=25Off_FOMO

 

Social

  • Twitter: https://www.mytotallyawesomesite.com/25offpromo?utm_source=twitter&utm_medium=social&utm_campaign=Feb2021_25Off&utm_content=25Off

  •  Facebook: https://www.mytotallyawesomesite.com/25offpromo?utm_source=facebook&utm_medium=social&utm_campaign=Feb2021_25Off&utm_content=25Off

 

Auto-tagging & dynamic UTM parameters are like bread & meat

If you are managing large, complex paid search or paid social campaigns, it is quite impractical to manage UTM parameters for tens of thousands of keywords and ads. Thankfully Google, Bing, and Facebook have solutions for this.

 

Google

Google has multiple ways to handle this.

  1. The gclid (Google click ID) is a unique identifier that stores information relative to the five UTM parameters and a lot more information. When enabled in your Google Ads account, it is automatically appended to the URL and read by Google Analytics without the use of UTM parameters. However, if you are using another tracking system that reads UTM parameters, it will not read the gclid. Sometimes if you're using a third-party management tool that uses redirect URLs, auto-tagging may not work. Check with your tool's own documentation on Google Ads auto-tagging to ensure compatibility.

  2. Tracking templates, + custom parameters + and Valuetrack dynamic parameters is a solution that allows you to put placeholders in URLs that get populated when a user clicks on your ad. For example, if I had utm_term={keyword} in my URL, and the keyword "dog sweaters" triggered my ad to show, whenever someone clicked on this ad they would see utm_term=dog%20sweaters show up in the URL. You can create what's known as a tracking template that dynamically fills in information for every single campaign, keyword in your account. If a particular parameter is missing from the list of available valuetrack items, you can assign a custom parameter to any campaign, ad group, ad, ad extension, or keyword in your account.

Bing

Bing uses tracking templates, custom parameters, and valuetrack parameters as well. Enabling auto-tagging automatically appends the below string to your URL:

utm_source=bing&utm_medium=cpc&utm_campaign={campaign}&utm_content={adgroup}&utm_term={keyword}

 

Facebook

Facebook has its own version of valuetrack which allows you to dynamically insert any of the following into your URL:

  • Source: {{site_source_name}}

    • This will be populated as fb for traffic delivered on Facebook, ig for traffic delivered on Instagram, and an for traffic delivered through the Audience Network.

  • Campaign: {{campaign.name}} OR {{campaign.id}}

  • Ad Set: {{adset.name}} OR {{adset.id}}

  • Ad: {{ad.name}} OR {{ad.id}}

When creating an ad, you can click "Build a URL parameter" and then enter any of these applicable values in the campaign source, campaign medium, campaign, and content fields in order to dynamically track your ads. Whatever you put here will be automatically replaced by Facebook when someone clicks on your ad.

facebook-utm-builder.gif

 

Caveats/words to the wise

Avoid the double question mark (?...?)

When building your tracking URLs with UTM parameters, always be aware if there is already a query string in the URL denoted by a question mark. If there is already a question mark, then begin adding your UTM parameters with an ampersand (&). For example:

Base URL: https://www.mytotallyawesomesite.com?id=2458

  • Wrong: https://www.mytotallyawesomesite.com?id=2458?utm_source=facebook&utm_medium=social&utm_campaign=spring2021

  • Correct: https://www.mytotallyawesomesite.com?id=2458&utm_source=facebook&utm_medium=social&utm_campaign=spring2021

 

Replace and encode characters ([space],|,&,/)

If you have an article named  "Top 5 Interview tips for Google/Amazon/Facebook," and you'd like to pass this title in the utm_content parameter, you would need to encode the string to replace spaces and the forward slashes. If you don't a number of undesirable things may take place:

  • The page may not load.

  • The page may load, but tracking parameters get cut off and fail to show up as desired in Google Analytics and other platforms.

A simple, yet awesome, free tool will do the encoding for you, so you don't need to memorize that %20 = space, etc. In order to encode your UTM value, input your string, and click encode. Next insert the encoded string in the utm_content parameter of your URL.

You can also use the ENCODEURL() function in Excel and Google Sheets to accomplish the same thing.

utms-encoded-decoded.png

Case matters

The values that appear in UTM parameters are case-sensitive. For example, utm_source=linkedin, utm_source=LinkedIn, and utm_source=linkedIn are read by Google Analytics as three different sources. Keep this in mind as you are creating your strategy for how you plan to track all of your campaigns and content.

 

Best practices when using UTM parameters

  • Before launching campaigns, determine your UTM naming convention, and stick to it. Make sure that anyone who creates a link also sticks to this naming convention.

How many of these Facebook source / medium combinations are the same?

How many of these Facebook source / medium combinations are the same?

  • Think about who needs to see these codes and how campaigns, mediums, and sources roll up into channels. Use this logic to make any necessary edits to your channel grouping rules in Google Analytics.

  • Use dynamic parameters and auto-tagging whenever possible.

  • For content and channels that do not allow you to use some form of auto-tagging or dynamic UTM parameter population, make sure that you lay out each URL along with its set of UTMs in a spreadsheet like this free tool we created for you to download. For any values that have spaces or any non alphanumeric characters (i.e. $,%,&,/), be sure to encode the string (our tool does this for you).

  • When sharing links on social media (especially Twitter), it's best to use a link shortener such as bit.ly. Some of the UTM creation tools such as Google's own tool actually have a link shortener built in or an integration with another tool that allows you to take your full URL with all UTMs intact and create a much shorter URL that redirects users to the your full URL.

google-utm-builder.png

  • Periodically review your traffic sources in Google Analytics, and make sure that any new sources and mediums are correctly mapped within your channel grouping rules.

 

Closing

In short, you absolutely should be using UTM parameters if you use Google Analytics and/or any other system that reads these codes. Without them, you run the risk of flying blind and not knowing which traffic is responsible for good and bad performance. If you need help creating and managing tracking URLs, download our free tool, and if you need help with your tracking and analytics strategy as a whole, don’t hesitate to contact us via the chat or the form down below.

Google Tag Manager: Tracking Button Clicks with GTM

Why track button clicks in Google Tag Manager?

Google Tag Manager is a very powerful tool, that enables marketers and web developers to tag actions on a website in a single web-based interface. Sometimes an action that a marketer needs to tag is as simple as clicks to a button. Depending on the site's business, a button click could be the main conversion action (i.e. an affiliate link) or it could be an engagement micro-conversion (i.e. open a video). In either case, a marketer would want to track a button, and thankfully Google Tag Manager makes it easy to do so.

 

How to track button clicks in Google Tag Manager

In order to track button clicks in Google Tag Manager, we need to create a trigger that fires whenever that button is clicked. How do we do that?

First we identify the button(s) you're looking to track. Then we right-click on the button and select inspect element. We’ll then see the html code associated with the button we clicked on.

This example does not have an id or class attribute, so we need to use other variables to properly track it.

In the code, find an attribute that is either unique to the single button that you're tracking or uniform across the many buttons that you're looking to track. If you're tracking a single button, it's best to use the id of the button if there is one, since id is an attribute that is unique to a single element on a page. If not, other characteristics may be used such as the text on the button in combination with the path or full URL of the page where the button resides. You can use Tag Assistant in order to verify that the elements you want to use are in fact correct. If you're tracking multiple similar buttons, it's best to use the class of these buttons if it is the same across these buttons, but not inclusive of other buttons that you don't want to track at this time. We are tracking a single button in this case, so we’ll use Click Text and Click URL in order to create our trigger.


In GTM, create a new trigger

Select the type Click - All Elements. Then select the "Some Clicks" radio button under This trigger fires on, and then select the firing condition. This particular trigger will fire on all clicks when the Click Text equals CONTACT US, and the Click URL contains #contact-form. Then name your trigger and save it.


Apply this trigger to a tag. You can add a blank HTML tag to your container and apply this trigger if you want to QA before sending false-positive data to GA or other platforms.

How do I QA my button click trigger?

In Google Tag Manager, go to Tag Assistant by clicking the Preview button near the top-right of the interface.

Then enter the URL of a page with your button in Tag Assistant, and then click on the button that you created the trigger for on your site. Did your tag show up in the “Tags Fired” section? If so, then your button click trigger works. If not, then you may need to go back to step 2 above and try another attribute. Also make sure that if your condition uses "equals," that your attribute appears exactly in GTM as it does in the site code.

Our blank tag has successfully fired.

Our blank tag has successfully fired.

If you need help with implementing click tracking or updating your entire Google Tag Manager container, don't hesitate to contact us via the chat or form below. We do full GTM audits, implementations, and customizations.

How to write CASE Statements

What is a CASE Statement?

Life is one big CASE statement! We are living in a series of conditions where if x = true then y happens. If I eat right and exercise, I will lose weight. If I drive to work, I will get there quicker than walking (unless you work from home). If you spend any time inside a database or a BI tool, the CASE statement will become one of your best friends.

 

By definition, a CASE statement is a function in most databases and BI tools that evaluates data against a set of conditions and produces a value based on the results of those conditions being true or false. The CASE statement is akin to the IF statement in spreadsheet tools like Excel and Google Sheets.

 

CASE statement syntax

The syntax of a CASE statement is below.  The statement must begin with the word CASE and terminate with the word END. Each condition begins with the word WHEN and is followed by the condition to be evaluated. Following the condition you have the word THEN and the result if that condition is true. Rinse and repeat as many times as necessary. Use ELSE to provide a catch-all or default value if no conditions are true.

CASE 
  WHEN [CONDITION 1]
    THEN {RESULT 1}
  WHEN [CONDITION 2]
    THEN {RESULT 2}
  ELSE {RESULT 3}     
END

 

Some examples of the syntax in action are below.

Metric example

CASE 
  WHEN `Clicks` = 0
    THEN 'No Clicks'
  WHEN `Clicks` >=1 AND `Clicks` <=10
    THEN '1 to 10 Clicks1
  ELSE '11+ Clicks'     
END

Dimension Example

CASE
  WHEN `Month` = 'June' OR `Month` = 'July' OR `Month` = 'August'
    THEN 'Summer'
  WHEN `Month` = 'March' OR `Month` = 'April' OR `Month` = 'May'
    THEN 'Spring'
  WHEN `Month` = 'September' OR `Month` = 'October' OR `Month` = 'November'
    THEN 'Autumn'
  WHEN `Month` = 'December' OR `Month` = 'January' OR `Month` = 'February'
    THEN ' Winter'
  ELSE 'Month Unknown'
END

 

Practical Applications of a CASE statement

If you're pulling data from Google Analytics into a Google Data Studio dashboard, you may want to create your own channel groupings if you haven't done so in Google Analytics. For simplicity's sake, let's say you want to create four channels + an "Other" channel for catching all unclassified traffic:

  • Search

  • Social

  • Email

  • Direct

  • Other

 

You could have a CASE statement that evaluates the source/medium in your Google Analytics data to produce a new channel field

 

CASE
  WHEN `source/medium` = 'google/cpc' OR `source/medium` = 'bing/cpc' OR `source/medium` = 'google/organic' OR `source/medium` = 'bing/organic'
    THEN 'Search'
  WHEN `source/medium` = 'facebook/cpc' OR `source/medium` = 'instagram/cpc' OR `source/medium` = 'twitter/cpc'
    THEN 'Social'
  WHEN `source/medium` = '%Hubspot%' 
    THEN 'Email'
  WHEN `source` = 'direct'
    THEN ' Direct'
  ELSE 'Other'
END

The CASE statement is your friend

CASE statements are not new, but if they're new to you, definitely try creating one in Google Data Studio, BigQuery, Domo, Tableau, or whatever platform you’re using. Do pay attention to the limitations and rules for whatever platform you happen to be using at the time. For example, Domo requires field names to be wrapped in tick marks (` … `), but BigQuery will let you get away with not placing the tick marks around the field names.

As always, if you have data, simple or complex, that requires CASE statements, don't hesitate to contact us for help.

Google Tag Manager - Getting Started

**This article has been updated in January, 2021 to reflect the change that replaced Preview Mode with Tag Assistant. For familiarity’s sake, this post shows how to install the Google Analytics 3 (Universal Analytics) tag. Once GA4 becomes more ubiquitous, we will update this article again to install GA4 via GTM.

Everyone has already told you that Google Tag Manager will make your life easier, but how do you get it on your site? Luckily it's very easy to install Google Tag Manager (GTM). We'll discuss how to set up your Google Tag Manager account, install GTM on your site, and adding & publishing the Google Analytics Universal Analytics tag.

Setting Up Your Google Tag Manager Account

Go to Google Tag Manager and make sure that you're signed into the Google Account that you want to use (or create a new one here).
Click the Create Account button to create a new account

GTM_CreateAccount.png

Fill in the appropriate information for Account Name and Container Name; select the Target platform (Web if this is for your website) and click the Create button

GTM_CreateAccount2.png

Read and accept the Google Tag Manager Terms of Service Agreement. At this time It is also advisable to check "I also accept the Data Processing Terms as required by GDPR."

 

 

Installing Google Tag Manager to your Site

After creating the account and container, you will immediately be greeted with a prompt to copy & paste some code onto your site. Follow the instructions and paste the code from the top window as high in the <head> as possible on every page of the website. Next, paste the code from the second window immediately after the opening <body> tag.

GTM_InstallCode.png

A couple of words to the wise…

  1. DO NOT SEND THIS CODE IN THE BODY OF AN EMAIL!

  2. DO NOT SEND THIS CODE AS A MS WORD ATTACHMENT!

 If you must email this code to someone else, paste it into Notepad and save as a Text (.txt) file before attaching to email. Sending in the body of an email or in a Word document may result in formatting that breaks the code.

 

Google Tag Manager and your Content Management System

Since we are well-past the Web 1.0 era of static websites, chances are that your site is built on a Content Management System (CMS). The process for installing GTM to your CMS may vary, but in most cases the process is straightforward. In many cases, your CMS may have an easy integration with Google Tag Manager, and you only need to copy the container ID (looks like GTM-XXXXXXX) into your CMS to get started. See below for some helpful links on installing GTM on popular CMS platforms:

Installing the Google Analytics tag to your GTM container

Now that Google Tag Manager is installed on the site, let's install your first tag. I'll assume that you already have created your Google Analytics account, or you are using an account that already exists. If you still need to create your account, go to Google Analytics create your account before proceeding.

In your Google Analytics Account, click Admin at the bottom of the left-hand-side panel.

GA_Admin.png

Then click Tracking Info >> Tracking Code and copy the Tracking ID that you see on the screen. It will look something like UA-123456789-1.

GA_TrackingCode.png

Go back to your Google Tag Manager window. We now need to create the Google Analytics Settings variable using this tracking ID. To do so, click Variables on the left-hand-side panel, and then the New button in the User-Defined Variables box.

GTM_CreateVariable.png

Next, give the variable a unique name like GA Settings, and then click inside the Variable Configuration box to select the variable type. After you do so, a panel with a list of different variable types will show up on the right side of the screen. About 3/4 of the way down this list will be Google Analytics Settings.

GTM_CreateVariable2.png

Click on it. Then input your Tracking ID that you just copied from Google Analytics. Then click Save.

GTM_GASettingsVariable.png

Next, we must create the Google Analytics Tag. On the left-hand-side panel, click Tags, and then click the New button.

GTM_CreateGATag.png

Give this tag a unique name like GA Universal Page View, and then click the Tag Configuration box to select the tag type. Next select the Google Analytics: Universal Analytics tag which should be the first option in the right panel.

GTM_CreateGATag1.png

Leave the Track Type as Page View. In the second drop-down menu, select the variable that you just created.

GTM_CreateGATag2.png

Next, we'll need to apply a trigger to tell this tag when to fire. Since this is our universal page view tag that should appear on all pages, we will select the default All Pages trigger that is already created in your GTM account.

GTM_TriggerAllPages.png

Now our tag should look like the below. Click Save.

GTM_CreateGATag3.png

Tag Assistant (Formerly Preview Mode) - Your Bestest Friend in the Whole World

Almost there! It's always a good idea whenever adding a tag to verify that the tag is firing before publishing it to the live website. A 2020 update has changed (for the better) how we QA our tags. We perform this QA by using what is known as Tag Assistant. Tag Assistant records the entire session across pages instead of showing you what happens individually on the current page. To enable Tag Assistant, simply click the Preview button near the top right of the page in GTM.

GTM_Preview.png

Next, a new browser tab will open, and you will be prompted to enter a URL. Enter the URL where you would like to QA your tag(s), and click the Start button. You should also leave the box checked that says "Include debug signal in the URL" unless adding this parameter would break your website.

Start_Tag_Assistant.png

In a third tab, you'll be taken to the page that you entered. You will notice that gtm_debug=x has been appended to your URL if you left the box checked in Tag Assistant.

debugsignal.png

Also you'll notice that there is a message that pops up in the bottom-right of your browser window that says "Debugger connected."

debugger_connected.png

Now you are ready to verify that tags are firing. Back in the Tag Assistant tab, you should see a panel taking up the majority of your window. In that panel, you should see a summary of the tags that have been fired on this page, and the tags that have not been fired on this page. Since we configured the GA Universal Page View tag to fire on all pages, this tag should appear under the Tags Fired On This Page section.

Tag_Assistant.png

To further verify that it is firing on all pages (and that GTM is installed on all pages), go back to the tab with your site and navigate through a handful of pages. After going to a few pages, go back to Tag Assistant and confirm that the tag appears in the "Tags Fired" section for each page. Seeing activity for each page is as easy as clicking on the page title as it appears on the left-hand side of Tag Assistant.

tag_assistant_multiple_pages.gif

NOTE - after you're done QAing your tags, don't forget to exit Tag Assistant by clicking the X at the top-left of the window and then clicking "STOP DEBUGGING."

exitTagAssistant.png
In order to save yourself a step for next time, check the box that says "Keep the domain [yourdomain.com] enabled for debugging."

In order to save yourself a step for next time, check the box that says "Keep the domain [yourdomain.com] enabled for debugging."

After you've verified that GTM is installed, and your Universal Analytics tag is firing properly, it is time to take a deep breath and publish to the live container on the website. To do this, click the Submit button near the top right of the page.

GTM_Publish.png

Then enter a name and description summarizing the changes you made, and click Publish.

publish_container.png

That's it! Now that you've installed Google Tag Manager and deployed the Google Analytics Universal Page View tag, you're able to see data populating in your Google Analytics account when users begin visiting your site.

 You now also have the ability to add more tags, triggers, and variables. Google Tag Manager is a very powerful platform, and once you understand how it works, you can use it for so much more than just adding the GA Page View tag to your site. Our team has been installing and customizing GTM for years and can help you take your site tracking to the next level.