Main Image

Google Tag Manager 101 Part 1 - The Basics

June 20, 2017: Update to include the new Google Tag Manager Google Analytics Settings variable

November 21, 2016: A recent Google Tag Manager release completely changed the user interface. The screenshots have been updated. 

Google Tag Manager (GTM) is a vital tool for a non-developer to build complex analytics that aren't available with "out of the box" Google Analytics (GA). In this article, you will learn how to move your Google Analytics to Google Tag Manager - by the end of Part 1 you will have GTM live on your website and recording page views.

The Google Tag Manager 101 Series

  1. The Basics - setting up Google Tag Manager

  2. How to create a trigger and a tag

  3. Tracking links

  4. Social media tags

  5. Forms

  6. Timers and the real bounce rate

  7. The Datalayer

  8. CSS Selector

  9. YouTube Video Tracking

  10. Scroll Tracking

  11. Trigger Groups

Last year I wrote a blog article on GTM soon after it was released. In the usual way, Google has already revamped GTM with a whole new interface and this has made it much easier to configure and to understand. (Usual warning for a blog article: if you read this in the future it may be out of date!)

Firstly, what is Google Tag Manager? Google says "Google Tag Manager gives you the power to create and update tags for your website and mobile apps, any time you want, at the speed of your business." The important fact is that you no longer need developers to make changes to your website to configure event tracking - previously it could only be done in website code with the usual delays involved with testing and release cycles.

1. Create an Account and a Container

Let's assume you have a live website with a Google Analytics Universal Tracking Code. In order to start using Google Tag Manager, you will need a code change in order to change the snippet that appears on every web page. You may be able to do this yourself or you may your developmers to do it for you.

First, if you don't already have one, create a Google Tag Manager Account. Create it here.

Google Tag Manager 101 Create Account

You will create your first Container within the Account. Each container has a unique GTM code.

An Account can have more than one container so if you have a test website, you can create a separate Container in order to test your tags before deploying to live.

2. Add the Google Analytics tracking code as a Variable

Every tag that you create will need to be sent to your Google Analytics tracking code. Rather than have to enter the tracking code for every tag, create a User-Defined Variable.

When you go into your new container, you will see the image below - from here you can switch between the Container Overview, your Tags, your Triggers, your Variables and your Folders. 

Google Tag Manager 101 Variables

Go into Variables and create a New User-Defined Variable. The Type is Google Analytics Settings and the Value is your Google Analytics Tracking code. I use the name ATC (Analytics Tracking Code) as this appears at the top of the list alphabetically but you can choose any name.

Google Tag Manager 101 Variables

3. Create a Page View tag to fire on all pages

Next you need to create the basic page view tag that will fire for every page view. Create a new tag that is the same as the one below. Make sure you copy this carefully and that the Fire Triggers selection is "All Pages".

Google Tag Manager 101 Variables

You now have the minimum GTM configuration to replace the standard GA tracking code and record all page views.

4. Publish your Container and deploy the GTM Snippet

At the top right of the screen is the button to Publish your Container. GTM stores versions of the Container so you can regress if there is an issue after you publish.

Google Tag Manager 101 Publish Container

5. Install the Google Tag Manager snippet

Now you need to retrieve the snippet and send through to your development team to add to the website. Go to the Admin section of GTM and choose the "Install Google Tag Manager" option

Google Tag Manager 101 Install Snippet

Google Tag Manager 101 Install Snippet

The location of the snippets has changed in recent months and is split between the <head> and the start of the <body>

Once this snippet is deployed to the website, you will be able to test your Container. 

NOTE: Do not leave the Google Analytics snippet on the page along with the Google Tag Manager snippet. If you do this, 2 page views will be sent instead of 1. 

6. Testing your GTM Container

At this point, you should check that your GTM container is correct.

The first test is that the Google Tag Manager ID is correctly installed on the website. To test the snippet is installed, use the Chrome Tag Assistant to inspect the home page of the website. You should see something like this. The GTM container ID and the GA tracking code should be displayed. If there are any warnings or errors, go back to the developers and consult them.

Google Tag Manager 101 Test your Container

Finally it is always a good idea to test that your website is recording page views in Google Analytics. From the GA account, go to the Real Time Overview and then visit the website from a separate browser window. Make sure you are not being filtered from the GA traffic and you should see your page views recording in real-time.

So now you have done some work to get to the exact same point as when we started - a website that records all page views in Google Analytics! In Part 2, we will create some tags that will enhance your Google Analytics reporting. You will know when users view your PDF files, when users click on links to external web sites and when users click on a mailto link.

Send any questions via the Comment box below or on Twitter or even on Google+