Intro to Google Tag Manager

Edit: 2018-10-30. Google now calls macros variables and rules triggers. I’ve updated the text but not the screen shots.

Google Tag Manager (GTM) is still pretty new as I write this. Stuff is still changing so I’m going to try to focus on techniques rather than step by step instructions (but I have some of those too).

What is GTM

You include a code snippet from GTM on your site which, among other things, includes a file. Then you use the GTM interface to configure what goes in that file.

This is intended to replace any scripts you’d normally have to write yourself to track stuff that isn’t a regular page view (example: tracking a file download as a page view). Say good bye to code like this: pageTracker._trackPageview(fileurl);

Why do we care?

One snippet to trigger them all. All your tracking scripts and pixels can be moved off the page and into GTM. Smaller pages, faster loading! They have some already supported services (AdWords, DoubleClick, Remarketing, Mediaplex…) and you can theoretically code support for others in yourself.

Theoretically, it means non-technical people will be able to do the set up for this kind of tracking. Less work for us! But let’s face it, the interface was written by devs, it still needs some technical knowledge.

It cuts down on the amount of code writing and maintenance we have to do in the future. Also less work for us!

Is it a trap?

Could be. Yup.

A javascript error in GTM code can break all the javascript on the page and anyone with access to your GTM account can add javascript.

GTM seems to insist on following the href on <a> elements. So if you are hijaxing any links GMT could break your code. For example: if you are using a lightbox style plugin which opens links in overlays.

Some GTM features can add query strings or hash tags to URLs, depending on the system on the other end of the link, this could cause problems too.

So test, and limit the publishing permissions on your account to people who know how to test.

Creating an account

Remember how we all went out and got personal Google Analytics accounts and added our clients to them and then stopped working for those clients and it got awkward? Google remembers too.

You hook an existing personal login up to GTM and then have the option to create accounts. One per business is ideal here. Then you get to set up what Google is calling a container. A container contains all the code snippets you are going to want to run. Google suggests you should create a different container for each website associated with the business that owns the account.

(This seems like sound advice if you’re just getting started but will lead to some code duplication in the long run if you have multiple domains, I have complicated thoughts on this that belong in a separate blog post).

Once you’ve set up a container you get the code snippet. Place the code snippet on the page after the opening <body> tag.

What’s all this?

Your container contains 3 things: tags, triggers, and variables.

Triggers

Triggers are when to apply tags. The basic one is “on every page”. Each trigger can have multiple conditions so you can combine them to create triggers like “if this event is a click and it happened on an element that does not link to this website”.

Variables

Variables are just a way to store stuff you’re likely to re-use (mostly text or javascript). There’s some pre-populated ones and you can write your own. Stuff I’ve been keeping in variables: our analytics tracking number, a line of javascript that retrieves the page title, and a complex regex that checks if the href of a link takes the user off the current site. You reference variables inside tags, triggers, and other variables by writing its name in {{double curly braces}}.

Example: Tracking page views and external link clicks with Universal Analytics

My examples are all for Universal Analytics but if you’re still using Classic the concept is the same where I pick Universal Analytics from the Tag Type menu pick Google Analytics Classic and do your best with the slightly different options that follow from there.

This is, more or less, what we’ll be setting up, in an order that makes sense to me:

I found the actual order somewhat more headache inducing, and that’s why I’m writing a blog post about it. Hopefully you end up at the end of this list with link tracking and no headache.

Once you’ve followed these steps once hopefully you will understand how the pieces fit together and you can go on to work in the way that makes the most sense to you :)

This is the part where I list actual steps, this part might change as the product develops.

You can see some changes applied immediately in Analytics on the Real-Time > Overview page. Other events which don’t seem to be working on Real-Time occasionally start showing up in the stats a day later. I have no insight to offer here, sorry.

Summary

So we create tags to do things, triggers to govern when we do the things in the tags, and variables to save ourselves time when creating tags and triggers.

Stephanie Hobson I like to make websites everyone can use.