Google Tag Manager For Business: The What, How and Why
Table of Contents
- What is Google Tag Manager?
- What makes Google Tag Manager worth using?
- How do we get past the technical barriers / learning curve?
- How will know it's working? What if I break something?
- What makes Google Tag Manager worth using?
- Glossary break
- What's a tag?
- What's a trigger?
- What's a container?
- What's a version?
- What's a variable?
- Simple use cases
- How do I setup Google Tag Manager?
- How do I install Google Tag Manager on my site?
- WordPress
- Squarespace
- Custom HTML
- Other
- Troubleshooting
- How do I add tags to my website?
- How do I setup Google Analytics in Google Tag Manager?
- Tracking Code
- Track a button click
- How do I setup Google Adwords in Google Tag Manager?
- Conversion Tracking
- Remarketing
- How do I setup Google Analytics in Google Tag Manager?
- How do I publish tags onto my site?
- How do I know that my tags are published?
- Advanced use cases
- How do I add a time delay to my remarketing tags?
- How do include Google Tag Manager on my AMP pages?
- How do I push a Data Layer event into Google Analytics?
- What are some custom tags I could be using to get better insights?
- Google Tag Manager resources
What is Google Tag Manager?
Google Tag Manager is a productivity and analytics tool built for marketers. It will save you time when implementing and updating tracking tags on your websites, apps and accelerated mobile pages (AMP). In the simplest terms, it's a Tag Management System. You choose which tags you'd like to load on your website, when, where and how you'd like to load them, and then publish them without all that extra coding work.
Google Tag Manager is a Tag Management System that lets you manage all your website tags (Google Analytics, Tracking Pixels, Hotjar, etc...) from a single dashboard. Instead of worrying about the coding logic and overhead for dozens of analytics tags and events, you can add Google Tag Manager to manage tags for your entire website.
What makes Google Tag Manager worth using?
Google Tag Manager is built for marketers to use (re: easy). Instead of having a developer maintain tags for your site(s), your marketers can manage what they want to track themselves. If they want to know how often a button is clicked, or want to know the conversion rate on an adwords campaign, or just want to...
Wait—what did I just say?
Get non-technical team members to manage website tags? Yes! Absolutely!
Your marketers produce a lot of content, and it’s worth tracking that content’s performance. Since they’re the ones who care about the numbers and have to deliver that proof of performance, they should be the ones to determine what data is measured.
Now, I know what you're thinking.... How do I teach non-technical marketers to add in complex tracking and analytics tags without breaking things?
Google Tag Manager is so easy to use that my grandmother could do 90% of the work with little training. Every major tag is added through simple forms, which not only eliminates the need for coding experience, but also saves a lot of time by reducing the potential for mistakes.
As for the non-technical marketer, it's incredibly easy to teach them how to do the basics like:
- add Google Analytics & Adwords
- add event tracking on his calls to action
- add a/b testing through Google Optimize
- add third party scripts or tracking pixels
It's easy. If you can use email, you can use Google Tag Manager.
How can we maintain quality control with Google Tag Manager?
Tag Manager has a couple great features. First, if you don't want to hand over the tracking keys to your marketer, you can give them access to update the scripts without granting access to publish to the live site. This way, your developer can vet any changes before they go live.
There is also a handy preview tool that tells you exactly which scripts are running, and those that aren’t. Here is a screenshot of it running on our blog. It can take some getting used to, but you end up with a crystal clear picture of which scripts are running and why.
As with anything - having a rock solid process for how to implement tags will help maintain quality and build confidence of your tag manager users.
Glossary Break
What's a tag?
A tag in this context typically refers to a piece of javascript that you would add onto your website for tracking purposes. So, for instance, if you include Google Analytics on your website, you would include their script tag.
Tags in Google Tag Manager are not restricted to just scripts, but it’s what you’ll be using 90% of the time.
What's a trigger?
A trigger is a rule that tells Google Tag Manager when to fire a tag. It's a set of parameters that GTM checks to know when (and when not) to fire a tag.
Say you want to include Google Analytics on all pages, AdWords Remarketing on just your landing pages or track clicks on specific buttons throughout your site—triggers help manage all of that logic.
What's a container?
A container holds a group of tags, triggers and variables. You use the container script tags to install Google Tag Manager on your site.
What's a version?
A version represents a set of changes on your tags, triggers and variables. Every time you publish to your website, you're effectively creating a new version. Versions help you stay organized by allowing you to review all your changes in a single place, and if you make a mistake, you can easily go back and correct it.
What's a variable?
A variable represents a piece of information you want to reference in the your tags and triggers. Google Tag Manager has a number of built-in variables like page url, click class, target url etc that you can reference.
Example: Only fire tags when {{page url}} contains "login.html", pass {{target url}} when buttons with {{click class}} are clicked.
You can also define your own custom variables if you feel like getting a bit fancy.
Simple Use Cases
Here are few simple use cases for Google Tag Manager. Consider these a guide as you start your journey with Google Tag Manager, and a resource for training others.
How do I setup Google Tag Manager?
This is an exceedingly straightforward process that goes a little something like this:
- Add an account name
- We used "Vendasta" for our account name
- Add a container as another name
- We used separate containers for our blog, website and landing pages
- Pick a category
- Most likely you just want to use Web or AMP
Don't worry about following their example container names. Call them whatever makes the most sense for you and your team.
For our Google Tag Manager install on Vendasta.com, we use a single account with many containers for different sections of our website. The blog, main website, support site and a few others all use different Tag Manager containers so we can easily silo conversion tracking and other tags as needed to stay organized.
After you've selected your account and accepted the Terms of Service agreement, you can install Google Tag Manager on your website.
How do I install Google Tag Manager on my site?
First thing’s first: you need to create a tag manager account and a container. After that, you'll get a popup with the instructions.
Lose your place? Getting back on track is easy.
Admin tab -> select account and container -> “Install Google Tag Manager.”
If you can't get your tags in the right place, it's not the end of the world—just try to get them as close as possible.
Here are quick guides to installing Tag Manager on some of the most popular content management systems.
Custom HTML
Now, if you're like me and have it drilled into your head that script tags should only ever go at the bottom of your source along the body tag, then these instructions may come as a bit of a shock. They aren't trolling—they are very serious. To get the most out of your tag manager install, you'll want to make sure you get these code snippets as close to the top of the head tag as possible, and same story for the body tag.
Other
Do you use another CMS and need some help? Let us know and we can add it to our list of tutorials.
Troubleshooting
If you have any trouble getting Google Tag Manager to load try the following:
- Turn off your popup / adblocker for your website
- Install the Tag Assistant (linked in our resources section of the bottom of this post)
- Ask for help here or on the Google+ community (linked below)
How do I add Tags to my website?
How do I setup Google Analytics in Google Tag Manager?
- Create a new tag
- Name it something along the lines of "GA Tracking Code"
- Click on the tag configuration section
- Select Universal Analytics from the list that appears
- You could also use analytics classic, but you're probably better off using Universal
- Add your Google Analytics Tracking ID
- You can leave the rest of the settings alone
- Track type should default to "page view"
- If you want to enable enhanced link attribution, you can do so under the advanced section
- Click save
- Click on the the triggering section
- Select All Pages from the list that appears
- You can add specific pages, exclusions or adjust your triggers to exclude your test environments or other places where the IP address filters in Google Analytics won't work to exclude traffic
- Click save
- Publish to your site
- Voila! Google Analytics tracking is live
How do I track a button click event in Google Analytics using Google Tag Manager?
- Create a new tag
- Name it something relevant to the button click
- Click on the tag configuration section
- Select the version of analytics that you chose when setting up your tracking code
- Add your Google Analytics Tracking ID
- Set "Event" as the track type
- Set the Category
- This is the broadest group for an event, so keep that in mind when choosing what to enter
- Set the Action
- In this case it will be "button-click," but if you wanted to track whenever someone sees a popup, you could have a "popup-shown" or "popup-closed" action
- Set the label
- Think of this as a reference to the content
- Think about future you—how are you going to find this event later?
- Protip: You can dynamically add in this information by clicking on the lego block and selecting Click Classes → Click Text
- Set the value
- If you're running an ecommerce website this becomes more valuable
- This is like a hypothetical dollar value associated to this event
- e.g. Every time that button gets clicked, how much is it worth to your business?
- Non-interaction hit
- This is asking whether or not this event counts negates a "bounce"
- If it's set to False, then the event will be considered like visiting a second page on your website
- Rule of thumb: if the event is a conversion event, then non-interaction hit = false
- Click on the the triggering section
- Create a new triggerSelect Click → All Elements
- Name the trigger "Button Click"
- Choose "Some Clicks" (instead of All Clicks)
- Set the Click ID or Click Class to match the button on your site
- Click “Save” on your Trigger
- Click “Save” on your Tag
- Publish to your site
- Voila! Google Analytics button click event will be live
How do I setup Google Adwords in Google Tag Manager?
Conversion Tracking
- Create a new tag
- Name it “Adwords Conversion Tracking”
- Click on the tag configuration section
- Select Adwords Conversion Tracking from the list
Enter your Conversion ID, Conversion Label and Value - Setup your triggers
- Want it to fire when a button is clicked? See our guide on how to do click tracking above
- Want it to trigger on a specific page? Simply set the trigger to fire when the page URL matches what you're looking for
- Save and Publish
Remarketing
- Create a new tag
- Name it “Adwords Remarketing”
- Click on the tag configuration section
- Select Adwords Remarketing from the list
- Enter your Conversion ID, Conversion Label
- Setup your triggers
- Want it to fire when a button is clicked? See our guide on how to do click tracking above
- Want it to trigger on a specific page? Simply set the trigger to fire when the page url matches what you're looking for
- Save and Publish
How do I publish my tags onto my site?
When you're ready to publish, you can do so immediately by hitting the big red publish button. You'll be prompted to outline what you're publishing with a name and description. You can skip this if you want, but it's definitely worth the minute or two if you're part of a Tag Manager team.
Lastly, you can select the Version you'd like to publish to. If you have a development or staging environment, and want to test your tags there first, you can do so by changing the "Publish to Environment" here.
See? That wasn't so hard! Now you're working just like all those developers with their zany commit messages.
How do I know that my tags are published?
I'll often check the source to look for a new script tag, or watch for live events in Google Analytics as I test new tags.
An easy way to confirm that your tags are performing as expected is to view your website in preview mode. The "Preview" option in the Publish drop-down menu will tell Google Tag Manager to open a debugging menu when you visit your website.
Once you activate Preview mode, you'll be able to go to your website and see the preview console. If you have trouble getting the console to show up, check the following:
- Check that tag manager is installed on your website
- Check that you're not using a popup blocker
- Not all of them block Google Tag Manager, but some do!
- Try sharing the preview to a different browser
- Sometimes your session can get bugged and won’t work, but sharing will bypass this issue
The Preview console will show you which tags have successfully loaded on your website, and which haven't. This is a bit too complicated to show off in screenshots, so you'll have to muddle through the process to figure it out. If you have trouble, or want a tutorial, let us know in the comments below and we'll whip one up just for you.
Advanced use cases
How do I add a time delay to my remarketing tags?
This used to be a lot more complicated, and involved custom javascript tags, but Google has added "Timer" triggers that fire after a set number of milliseconds. You can easily create one of these by adding and filling out a new Timer trigger.
The two settings here you really need to watch out for are the Interval and Limit.
Say our Interval is set to 30 seconds. It will then fire every 30 seconds until the limit is hit. If we only want to fire it once or twice, then we need to make sure that a limit is in place.
You can set other conditions to only enable this trigger on specific pages, or start after other events like button clicks, etc...
How do I include Google Tag Manager on my WordPress AMP pages?
If you're curious about what AMP is, and why it is important, you should check out our post about it over here.
The TL;DR (too long; didn't read) on this is that having Accelerated Mobile Pages (AMP) enabled is a must-have for any website you want to rank on Google.
Keep in mind that AMP doesn't allow most tracking scripts, so you won't get the same flexibility out of Tag Manager that you may be used to. This is still very new, so additional script support will be added on an ongoing basis.
This tutorial recommends using three custom plugins to enable AMP, and get the tracking code added. This isn't the perfect way to enable Google Tag Manager, but it will work for John Smith marketer to get started until he can wrangle a developer to set-up a better solution.
Start by creating a new Google Tag Manager container for your website. This time, instead of selecting Web, select AMP. Note down the installation details for both head and body sections.
Get AMP on WordPress
If you don’t already have AMP on your WordPress site, you’ll need it. The easiest way to get this out of the way is by installing and enabling the official AMP plugin here.
Enable GTM in AMP
Next up, enabling Google Tag Manager in AMP! I recommend doing this through two additional plugins.
- First, get Yoast
- Then, get the Yoast addon for AMP integration/
Once you have these installed and enabled, you'll be able to add your Google Tag Manager container code in the AMP subsection of the Yoast menu.
Note: Google Tag Manager will give you the same head and body tags. You can add both head and body script tags into this space to track effectively. To add GTM to your AMP pages according to Google's specifications, you'll have to add hooks into the WordPress AMP plugin itself.
How do I push a Data Layer event into Google Analytics?
Now, I've intentionally avoided talking about the Data Layer as it can be very daunting for John Smith marketer, who’s brand new to Google Tag Manager. That being said, the Data Layer is the heart and soul of Google Tag Manager, and using it gets easier as you work with it.
Say you have a very custom form validation, or some other event that is more complex than standard triggers will accommodate. How can you track these? The answer is the Data Layer.
Firing a custom event is pretty easy, but if you mess it up, you can break your Google Tag Manager install. Make sure you follow this guide!
Ready? Let's get started.
First off, we want to make sure we don't overwrite the dataLayer, but also want to initialize it if it doesn't exist so that we don't throw JS errors. We do this by assigning it to window.dataLayer if it exists, otherwise it turns into an empty array.
window.dataLayer = window.dataLayer || [];
Easy, right? Now we push an event to it just like we would add an event into an array. In this case, I want to notify tag manager that my demo form submit was valid.
window.dataLayer.push({'event': 'demoform_valid_submit'});
Tracking this in Tag Manager involves a bit more busy work to setup the infrastructure, but we're almost done.
First, go into your variables and make sure you've enable the built-in "Event" variable.
Next, we create a new "Event" trigger with our events' name on it. You need that variable type enabled in order to create this trigger, so be sure to do so!
Lastly, you can add extra clauses to the trigger in case you only want it firing on some pages.
All you need to do now is add a Google Analytics event tag with this as the trigger, and you're done!
