How to Install Google Tag Manager
Google Tag Manager is a free tool that allows you to execute scripts, events and other tags on your website. The primary benefit of Tag Manager is that you can by-pass a lot of development work. It also helps to keep your site organized and clean.
Once GTM is installed on your site, you'll create triggers that will fire your desired tag. A trigger is some sort of interaction with your website (click, pageview, etc). A tag can be a Google Analytic event, a chunk of Javascript code, tracking pixel, etc.
This step-by-step guide will walk you through the installation process for Google Tag Manager (GTM). The account creation and install process is very easy and should only take a few minutes. To begin you'll need to have the following:
- Website with Development Access
- Email Address (Gmailify)
Gmailify is an email address that is granted the ability to work with Google products and shares many of the benefits that come with a Gmail account. If you receive the error "Couldn't find your Google Account" then you email address is not Gmailify. The easiest way to resolve this is by creating a Gmail account for your site. You can also setup your email through the G-Suite, but that is an article I have yet to write.
Creating a GTM Account
Getting Started
To begin, open the Google Tag Manager page.
Upon arrival you'll be prompted to log into your Google account. Once logged in, you'll see the Tag Manager dashboard. At the top right click Create Account.
Add a New Account
We'll need to enter some basic information about your website. Under Account Setup, enter the name of your website or business. Then select your country and you have the option to share data with Google. I usually keep this unchecked.
Moving onto Container Setup, enter the url of your website. Do not enter special characters in this field. If you are uncertain how to enter your url, open the screenshot below. Now select the targeting platform. For this example we are going to select Web.
Once completed select Create to proceed.
Terms of Service Agreement
Please read the terms of service agreement and click "Yes" if you accept the terms. Once accepted you'll account will be created.
Installing GTM Scripts
Now we need to place the tag manager scripts on your website. This is where you'll need developer access to your templates. After creating your account, you should have been taken directly to a screen with two blocks of code.
How to Find GTM Scripts
If you've accidentally closed that screen, you can easily bring them back by clicking on your Container ID. It is located at the top of the page to the left of the Preview button. It will look something like this: GTM-XXXXXXX.
Placing the GTM Code on Your Website
Copy the first script and place it directly after the opening <Head> tag in all of your templates. The GTM script should take priority over every other tag in the <Head>. This will allow GTM to fire first and without issues.
Next, place the 2nd script directly after the opening <Body> tag in all of your templates.
Save your changes and that is pretty much it. You've installed Google Tag Manager.
<html>
<head>
<!-- Place First GTM Script Here -->
<!-- Other Code -->
</head>
<body>
<!-- Place Second GTM Script Here -->
<h1>Testing GTM</h1>
<p>Content</p>
</body>
</html>
Confirming Installation
Now that the code is on your website, let's confirm that the scripts are firing properly. In the Tag Manager dashboard click the Preview button located at the top right. You should now see the box indicating that you are in Preview mode. This will allow you to test triggers and tags before publishing them.
GTM Debug Mode
Open a new window and visit your website. The GTM debugger should active at the bottom of the screen. Don't worry, only those logged into your GTM account will see the debug mode. You're users will not see any of this information. If the debug mode fires, that will confirm that you've installed GTM correctly.
Installation Completed
After confirming your install, you'll want to return to the GTM dashboard and disable the debug mode. Simply click Leave Preview Mode, which is located under the orange box. That's it, I hope you have foundthis guide helpful. Be on the lookout for my next GTM post about how setup your first tags and triggers.
Troubleshooting Google Tag Manager Install
Are the Scripts in the Correct Locations?
This is a common mistake. Either the scripts are mismatched or they are in the wrong location. My suggestion would be to remove both and start over, but take your time to ensure they are placed in the correct locations.
Disable AdBlockers
Your script could be working correct, but an AdBlockers or browser extensions could be blocking debug mode. Close any of these programs or try the site in incognito mode.
To access incognito mode press: CTRL + Shift + n
Are Other Scripts Interfering with GTM?
Another script on the site could be preventing GTM from firing correctly.
- On your website, open DevTools by pressing: F12 or CTRL + Shift + i
- At the top, select console
- All issues will be highlighted in red
These are issues harming your site and they are likely the culprit preventing GTM from working properly. Troubleshooting these errors can sometimes be extremely difficult. Best of luck!
Try Placing the Code on an Empty Template
Let's dumb things down a bit. Create a blank template without any other scripts or code. Place the GTM scripts in the correct locations. Then create a test page that uses the blank template. Debug mode should now fire correctly, if not make sure you are accessing the correct site.
