An Introduction to Google Tag Manager

Digital marketing thrives on data. No matter what type of site you have, whether it’s a large e-commerce site or a site for a small business, it’s crucial to understand how people interact with your site.

Tools like Google Analytics can provide many insights, but when used alone, they can have some limitations. However, by tagging your site with Google Tag Manager (GTM) and using it in conjunction with Google Analytics, you’ll be able to collect more data than you’d be able to otherwise.

Let’s start by understanding what a tag is. A tag is a snippet of code that gets added to a site to collect information and send it to third parties. Tags can be used for many different purposes, such as scroll tracking, generating heatmaps, remarketing, and collecting information about conversions. They can also be used to monitor specific events, like form submissions, file downloads, clicks on certain links, or items being removed from a shopping cart.

Now, what is Google Tag Manager, and how does it help?

Simplifies tagging

Sites commonly use several different tags, and the amount of code needed to create them all can be overwhelming – especially if you’re trying to add or edit those tags by going directly into a site’s source code. Even if you’re experienced with coding, it can still be easy to make mistakes while creating tags. Plus, manual tagging can be very tedious and time-consuming. Google Tag Manager simplifies the tagging process by providing a user-friendly interface where people can quickly add, edit, and disable tags without having to touch source code.

Lessens reliance on web developers

Being able to work with tags without having to change source code makes it possible for marketers to get their work done without having to be as reliant on developers to handle tagging for them. Since developers typically have a lot of high-priority tasks to worry about, tagging often ends up being put on the back burner. So, GTM helps marketers work more efficiently while giving developers less to worry about. However, some support from developers is still necessary for things like adding container codes to a site and creating more complex customized tags.

Use GTM to manage third-party tags

While GTM is a Google product, it’s not limited to only working with tags for other Google services. You can use it to manage many third-party tags, including Bing Ads, Crazy Egg, and Facebook pixels, just to name a few. If there’s a tag that doesn’t have a template in GTM, you can create one with custom code.

Tags created in GTM load asynchronously

Another issue with putting tags directly in the source code is that if they fire synchronously, they can slow down site speeds. When tags fire synchronously, one tag being slow to load slows down all the other tags that are waiting on it. And the longer a site takes to load, the more likely it is that people will leave without doing anything. But tags created in GTM load asynchronously by default, meaning each tag can fire anytime it’s ready to. If you need to control the order in which your tags are fired, there is functionality in GTM to let you adjust tag sequencing and firing priority. However, it’s important to note that GTM’s impact on site speed can be a complex matter, and it’s still possible for asynchronous tags to affect load times.

GTM can be used for AMP sites and mobile apps

You’re not even limited to just using GTM with standard websites. GTM can also be used to manage tags for AMP sites and mobile apps. Using GTM for AMP sites or mobile apps is pretty similar to using it for a regular website, but there are some differences. For the purposes of this guide, we’ll focus on using GTM for the web.

Before we get into working with Google Tag Manager, let’s break down a few more concepts that are important to understand first.

Containers

When you start working with GTM, the first thing you’ll need to do is create a container. A container essentially “holds” all the tags for your site.

After creating a new container, GTM gives you some code to add to your site. This is your container code, and it will need to be added to your source code so it’s included on each page of your site. Some CMSes, such as WordPress, have plugins to implement container code, but you may need to contact your developer to have it added. Once your container code has been implemented, you’ll be able to add, edit, disable, or remove your tags as needed through GTM.

Triggers

Each tag on a site needs to serve a specific purpose. Maybe you want to have a tag fire when someone downloads a file or when a form is submitted. These sorts of events are known as triggers, and all tags need to have at least one trigger assigned to them; otherwise, they are not going to do anything.

Triggers can be broken down into two main components: events and filters. When you go to configure a trigger in GTM, you’ll be given a long list of types of trigger types to choose from. These are your events. Once you choose an event, you’ll be able to set up your filter.

Filters can be divided further down into three parts: variables, operators, and values. We’ll talk more about variables in just a minute, but in this case, it simply refers to the type of variable involved. The operator tells the tag whether an event needs to equal a value, if it should be greater or less than a certain value, or contain a certain value. The value is the condition that needs to be met. Even though the word “value” is typically used to talk about numbers and prices, in this case, a value doesn’t necessarily have to be numerical. Instead, your value could be something like a URL or a keyword.

For example, let’s say I wanted to see how many people were reading the blog content on my site in depth. I could create a tag with a scroll depth trigger that should fire when the vertical scroll depth reaches 75%.

If I wanted this tag to fire on every page of my site, I could leave the “All Pages” option selected in the trigger configuration box, and I wouldn’t have to create any further filters. But since I’m focusing on blog content, I’d choose “Some Pages” and create the filter “Page URL,” “Contains,” “myfakewebsite.com/blog.”

If you have a tag that you’d like to fire on most of the pages on your site but there are a few pages you’d like to exclude, you can use a blocking trigger to prevent it from firing on those few pages. GTM prioritizes blocking triggers over other types of triggers, so if you have a blocking trigger that contradicts a condition set by another trigger, Google Tag Manager will follow what’s specified by the blocking trigger.

Variables and constants

While tags depend on triggers, triggers depend on variables. Variables contain the value a trigger needs to evaluate to know whether or not it should fire. The tag compares the value of the variable to the value defined in the trigger, and if the variable meets the conditions of the trigger, the tag will fire. Returning to my scroll depth trigger example, the variable would be the 75 percent vertical scroll depth.

Tags also use variables to collect information that can be passed onto the data layer as a user interacts with the site. A typical example of this would be if a tag were set to fire when a person adds a certain amount of products to their shopping cart.

Variables can often be reused between tags. One popular tip for using GTM is to create variables with the ID numbers or tracking codes you’ll need to use more than once. Let’s say you need to use your Google Analytics measurement ID in multiple tags. You could create a variable with the value being your ID number. That way, instead of repeatedly having to look up and enter your ID number, you can just select the variable name.

When using GTM, there are two different types of variables: built-in variables and user-defined variables. Built-in variables are some of the most commonly used types of variables, so Google made them easy to access in GTM. Once you select a built-in variable, you’ll be able to configure its settings however you’d like.

The variables listed in the above screenshot are just a few of the built-in variables available for web containers. Many more built-in variables can be accessed by clicking the Configure button. If you need another type of variable that’s not included as a built-in variable, you can create a user-defined variable.

Variables can be created from the GTM dashboard by clicking the Variable button on the left menu. You can also create them while you’re creating a tag by clicking on the button next to the field, which looks like a Lego block with a plus sign on it.

Data layers

Tags need information to know whether or not they should fire, but where do they find that information? One option is by checking the page’s HTML, but that’s not an ideal solution for a few reasons. When tags need to search through HTML to find information, it can take longer for them to fire. If the site’s HTML structure changes over time, it can cause tags to break. There may also be certain types of information a tag needs that won’t be found in a page’s HTML, like a transaction total.

A data layer is a JavaScript object that keeps the information that tags need separate from the rest of a site’s code so that tags can quickly find what they need. Technically, data layers are optional. You don’t have to specifically define one yourself; GTM can initiate one for you. But if you want to use GTM to track specific events, you’ll need to have a data layer.

To start with, a new data layer object will look like this:

When adding a data layer, the object needs to be placed before the GTM container code. If the data layer object is placed after the container code, GTM won’t be able to access the information in it, and the data layer will basically reset after loading.

Once the data layer object has been added to a page’s code, the brackets in the second line can be populated with information, variables, and events. Some types of information can be written directly into the data layer, but other types of information will dynamically be pushed into the data layer as a user interacts with your site, such as if someone downloads a file or if they add a certain amount of products to their shopping cart.

Creating accounts and containers

To get started, open up Google Tag Manager and start creating an account. When you go to create an account, you’ll be taken to a screen with two sections: Account Setup and Container Setup. In the Account Setup section, enter the name of the company whose site is being managed or your site’s name. Then, in the Container Setup section, enter your domain name as the container name, choose which type of page or app it will be used on, and click Create.

Note that I said to use the company name or site name as the account name and the site’s domain as the container name. Of course, you can name these anything you like – this is just a recommended best practice. Generally speaking, one of the best things you can do when working with GTM is to make sure everything is named very clearly. Otherwise, it’s very easy to make mistakes.

Multiple GTM containers can be managed within a single GTM account, but Google advises creating one container per domain. You don’t have to create separate containers for each individual tag or for every individual page on a site; all tags can be placed within one container. For most companies and organizations, one container is all they need. But if a company has subsidiaries or owns separate businesses, the website for each subsidiary/business should get its own container, and all the containers can be managed from one GTM account. If a site has a subdomain that is treated separately from the main domain, the subdomain should also be given its own container.

When a marketing agency is managing tags on behalf of a company, Google recommends that the company create its own GTM account and then add the agency’s Google account as a user. This way, the agency can access GTM, but the company can easily revoke access if they decide to change agencies.

After creating your container, accept the terms of service, and you’ll be given your container code.

Once the container code has been added to your site, you’re able to start creating tags. Before you get started, it’s a good idea to take some time to plan out which tags you want to add. Even though there isn’t a limit to the amount of tags you can add to a container, it’s best to keep the amount of tags you use to a minimum for best performance.

If you’re migrating tags to GTM from another tag manager or are switching over from tags hardcoded in the source code, take some time to review which tags are currently on your site. It’s very common for sites to end up with tags that are associated with services that are no longer in use or were used to track things that aren’t being monitored anymore, so this is a good opportunity to clean things up.

Creating a tag

When you create or select a container, the first thing you’ll see is the GTM dashboard. If you click Add a New Tag, it’ll open up a window where you’ll be able to name and configure your tag.

Before we go any further into the process of creating tags, remember to name your tags very clearly. With how many different tags sites can use, you won’t want there to be any confusion about which tag serves which purpose. As a best practice, the naming convention you choose for your tags should help you stay organized and be used consistently.

One popular naming convention for tags is: Tag Type — Detail — Location. For example, a Google Analytics tag that tracks downloads of whitepapers could be named something like “GA4 — Download Whitepaper Title.” Since GTM lists tags alphabetically, putting the tag type at the beginning of the name groups similar tags together so that you can quickly find what you need. Including the location of a tag in its name helps distinguish it from similar tags on other pages. Going back to my whitepaper download example, if I had multiple whitepapers on a site, including the title would make it clear which one the tag is linked to.

Now, back to creating a tag. When you click Add a new tag on the dashboard, this is the window you’ll see:

When you click on Tag Configuration, you’ll be given a long list of tag templates to choose from, which includes many of the most commonly used types of tags. If any of these are what you’re looking for, click on it and enter the information requested. If you don’t see the type of tag you want to create listed, choose Custom HTML to add your own code.

After you click on the type of tag you want to create, you’ll be taken to a screen where you can start configuring it. The exact information you’ll need to provide depends on which type of tag you’re working with. For example, let’s say I wanted to notify Google Analytics anytime someone views an article on my site. After choosing Google Analytics: GA4 Event, this is what I’d see:

From here, I would enter my GA4 measurement ID and event name and press Save. Next, it’s time to configure a trigger. After saving your tag configuration, it will bring you back to the screen with Tag Configuration and Triggering sections. Click on the Triggering section to bring up a list of available triggers. If you do not see the trigger you need listed here, press the plus sign in the upper right to create it.

Since I’m only focusing on some pages on my site, I’d select Some Page Views and configure the trigger to fire when the URL reflects the article section of my site. If I had another trigger to add, I could click the + button next to the trigger I just created to set one up. If I had created multiple triggers for this tag and later decided to get rid of one, all I’d have to do is hit the - button next to the trigger in question. When you’re done, click the Save button.

Once your tag and trigger have been configured, save it and you can either keep working by creating more tags or you can preview your tag and make sure it’s working correctly before publishing it.

Once you’ve made some tags, you’ll want to ensure they work as intended. GTM’s Preview & Debug mode lets you test tags before publication so that you can make sure everything works correctly and that you won’t have any errors that throw off your data collection.

To enter Preview & Debug mode, click the Preview button in the upper right corner of the GTM dashboard. This will open Google Tag Assistant in a new tab where you’ll see this window, asking you to connect your site to Tag Assistant.

Once your site is successfully connected, you should have another tab open the URL of the site you entered with a box indicating that it’s connected to the debugger (don’t worry; that box is only visible to you, not to anyone who might be visiting your site.)

On the left side panel in your Tag Assistant tab, you’ll see a summary that outlines all the events that occur on the page you’re checking. At a minimum, you should be seeing at least three events listed here: Container Loaded, DOM Ready, and Window Loaded. If you see more than three events listed, that’s okay. But if any of those three main events are missing, you’ll need to check into why those events are missing because it’s a sign that something needs to be fixed.

When you click on any of the events in your timeline, you’ll see all the tags that are set to fire when that event occurs. Click on any of the tags to see more detailed information about its triggers, properties, and if there are any blocking triggers associated with it.

As you work in Preview & Debug mode, you’re the only one who can see the information about your tags. That said, let’s say you find an issue that you need to bring to someone else’s attention. You can share your preview with that person through Tag Assistant. In your Tag Assistant tab, look for the three vertical dots in the upper right, click on them, and choose Share. From there, you can select the tags you need to debug to get a shareable link to send to the person who can help.

Once all of your tags are firing correctly, go ahead and publish them. From your GTM dashboard, hit the Submit button in the upper right corner, and you’ll be asked to review your changes. If everything looks OK, enter a name and description for your new container version and publish it.

When you publish changes in GTM, it creates a new version of your container. If there’s ever a problem and you need to revert to an earlier version of your container, all you have to do is click the Versions button at the top of the GTM dashboard, choose the version you’d like to revert to, click Action, and then Publish.

Suppose you’re migrating your tags from another tag manager or from tags directly coded on your site. In that case, Google recommends setting up all of your tags in GTM, then removing your old tags all at once and publishing the GTM container with your new tags as quickly as possible. You might have a very small gap in your data collection, but there shouldn’t be any more issues after your new tags are live.

When you have multiple people working in GTM, workspaces can help make life a little easier. Even if you aren’t directly collaborating with others, having the option to create separate workspaces can still be very helpful in some situations.

Workspaces allow multiple users to work on tags at the same time without interfering with each other’s work. Each workspace uses the current published container version as a basis, but the tags in each workspace can be edited, previewed, debugged, and published independently from the tags in other workspaces.

If you’re working with the free version of GTM, you can have up to three different workspaces, one default workspace, and two others. But if you use Google Tag Manager 360, you can create an unlimited amount of workspaces.

If you want to create a new workspace or change which workspace you’re working in, look in the upper left of your GTM dashboard for the Current Workspace heading. When you click on the box underneath that heading, it will bring up a menu that lists all of the workspaces created with your account.

To create a new workspace, all you need to do is click on the plus sign button in the upper right, enter a name and description for your workspace, and press the Save button. If other workspaces have previously been created, they’ll be listed here, and you can just click on the workspace you want to use.

When one workspace is published, it creates a new version of the container. If there are any other workspaces with unpublished changes saved in them, the user(s) working in those spaces will see a notice saying that they need to update the workspace. Updating the workspace syncs the changes in the container to their workspace.

While it’s not required to update to continue working, it’s generally best to stay on top of updates so that you’re not working with an outdated version of the container.

After syncing changes in a workspace, you’ll be notified if there are any conflicts that need to be resolved. If any conflicts exist, you can review them and either ignore the conflict or copy the change. When you copy the change, the field in question in your workspace will be overwritten with the information from the latest container version.

If necessary, you can set user permissions on workspaces to prevent people from making unwanted changes. Let’s say you have a developer working on some complex custom tags. In that case, the developer might want to create a separate workspace and limit the user permissions so that only they can make changes to it. This way, marketers will be able to go in without accidentally making changes to the custom tags.

If you have more than one person working on tagging, a great thing about GTM is that it lets you see which changes were made, when they were made, and who made them. On the dashboard, you’ll see a Workspace Changes section, which outlines some of the most recent changes that have been made to tags and triggers. If any mistakes have been made, you can use the Abandon Change option to delete those changes. Beneath Workspace Changes, there’s Activity History, which shows all activity on a GTM account.

Ready to get started? Best of luck with your tagging projects!