How to Install Google Tag Manager (GTM) in 2024

GA4 Analytics Tools
Demo

Ever wondered how top websites seamlessly track their analytics and optimize their marketing efforts? The secret lies in a powerful tool called Google Tag Manager. Whether you're managing a few services or overseeing a complex site without a full-time developer, integrating GTM can transform your data strategy.

You need to add their code to your site to use web analytics systems, advertising services, and other third-party tools. It’s not difficult if you understand HTML, and you’re using a couple of services, or if you have a full-time developer.

You start facing problems when you need to make changes to installed code or add new integrations, such as the Google Analytics tracking code.

First, it takes a lot of time. Second, by making changes to one piece of code, you can accidentally break the entire site. Luckily, Google has created a great tool to help you out — Google Tag Manager or GTM.

With GTM, you can easily change the code on pages, add new fragments, and integrate your site with analytical systems, advertising, and other services.

Note: This post was originally published in December 2018 and was completely updated on Website Analytics in September 2024 for accuracy and comprehensiveness.

What is Google Tag Manager?

Google Tag Manager enables you to easily manage JavaScript and HTML tags without a developer’s help — well, almost without help. You’ll still need to ask a developer to install the Tag Manager code on your site. But after that, you can add any services and new scripts right in the Google Tag Manager interface yourself.

Google Tag Manager enables users to implement Google Analytics quickly and efficiently, streamlining the process of creating and managing marketing tags without the need for extensive coding knowledge.

With a Tag Manager Account, you can:

  1. Set up data transmission to Google Analytics, AppsFlyer, and other analytical systems
  2. Place Google Ads, DoubleClick, Facebook, and other remarketing tags on your site
  3. Place custom HTML scripts on your site to display banners, conduct A/B testing, and so on
  4. Quickly edit tags.

Who is Google Tag Manager designed for?

  1. Web analysts and internet marketers implement external services themselves, create effective end-to-end analytics systems, and track important KPIs
  2. Specialists in contextual advertising and SEO — for remarketing, evaluating ad campaign performance, and setting goals.
  3. Owners of small sites — to manage web analytics without a developer’s help
  4. Online marketing agencies — to work quickly and effectively with client accounts

Tag Manager Pros and Cons

In addition to the features described above, Tag Manager has additional benefits to simplify your life and help you save time and money:

  1. It’s completely free.
  2. There are lots of ready-made integrations with other services. You can see the list of all supported 3rd party tags in the help menu.
  3. It improves the speed of your site by shortening code so pages load faster.
  4. It has a check and debug mode. You can test how tags operate before adding them to your site.
  5. It saves all changes in settings. You can return to a previous version at any time if you publish code with errors. You can also find out exactly who made what changes to the code and precisely when.
  6. You can delegate different levels of access to the Tag Manager accounts of your employees or marketers from an advertising agency with whom you cooperate.
  7. It’s easy to verify your site ownership in Search Console.
  8. Tag Manager has a large community, an official forum, and a support section where you can find answers to many questions.
  9. To confirm the proper installation of GTM on your website, you can use Google Tag Assistant, a useful Chrome extension.

But there are also some disadvantages of Google Tag Manager:

  1. If you accidentally damage the GTM container code when making edits, then all tags deployed with it will stop working. You’ll have to look through the code to correct the error.
  2. Installing GTM code on your site and having flexible settings (for example, custom tags) requires knowledge of HTML, JavaScript, and the DOM.
  3. GTM doesn’t offer online support or reports.

Track Ad Costs and Conversions in GA4

Easily link ad spend to GA4 conversion data to see your true marketing ROI. Get accurate KPIs and make better business decisions

Start Free Trial
Measure CPO and ROAS in GA4

Google Tag Manager structure and terms

In Google Tag Manager, you can create multiple accounts for one Gmail address. But often, one is enough unless you're an agency that works with sites for many companies.

The next step above accounts in the GTM hierarchy is the container. A container stores all the tags for your website, mobile app, or AMP page. You can create multiple containers in your account — a separate one for each resource. On the technical side, a container is the main GTM code, which is installed on the site and allows you to run tags for other services.

A tag is a piece of executable code. It can transmit data to analytics systems and other third-party applications, launch remarketing campaigns, send emails to users who have abandoned their carts, change the contents of A/B tests, and so on.

You can use ready-made tag templates:

Or create your own tags if you know HTML:

A trigger is a required condition for firing a tag. It can be set to activate and block a tag. A trigger must contain an event: clicking on a button, loading a page, clicking on a link, etc. You can also set filters for each trigger, for example, by specifying the URLs of the pages on which the tag should fire.

In Google Tag Manager, all triggers are divided into four groups:

  1. Page view: Activate the tag when the page is just starting to load or when it has loaded completely
  2. Click: Set a trigger for clicks on any element or link
  3. Interaction with users: View video, page view depth, view site elements, form submission
  4. Other: For example, set a timer to fire a tag, set up tracking of JavaScript errors, or create any custom event that isn't in the trigger templates.

Triggers in Tag Manager:

A variable is a parameter and its value. You can set filters in triggers using variables. For instance, if you need to track page views of www.site.com/product, you can set up a page view trigger that will only fire when the Page URL variable takes the site.com/product value. In tags, variables are used to store and transfer data about users' actions on the site, transactions, products, and so on.

Currently, GTM has 44 built-in variables for websites. Just tick the box to activate a variable:

If the built-in variables aren't enough, you can create custom ones using JavaScript code and CSS selectors. This allows you to track almost all visitors' actions on the site.

How to install GTM on your site

To start, you’ll need to create a Google Tag Manager account and install the Tag Manager code on your site. After that, all other settings can be adjusted in the service interface without involving programmers.

In short, to install GTM, you’ll need to:

  1. Create an account and container in Google Tag Manager;
  2. Install the Google Tag Manager code on your site;
  3. Publish the container;
  4. Check Google Tag Manager.

1. Create an account and container in Google Tag Manager

On the Tag Manager homepage, click the Register button and sign in using your Gmail address or any other Google account.

To learn how to set up Google Tag Manager, you need to create an account directly in Tag Manager. To do this, click Sign in to Tag Manager.

Next, click Create Account:

Think of a name for your account — it’s most convenient to use your company name. Then select the country, check the box next to “Share data anonymously with Google” and other services (optional), and click Continue.

Now, you need to configure the container. If you compare the structure of Google Tag Manager with the structure of Google Analytics, then the container is the equivalent of a resource in GA. It stores tags, triggers, and variables for the entire site.

There can be several containers in one GTM account: for the website, for the mobile application, for AMP pages, and so on. To make it convenient, it’s better to name the container after the resource for which it’s created. For example, this may be the address of your site.

After you’ve entered the name of the container, select where it will be used (in our example, this is the Web) and click “Create”:

Read the rules for using Tag Manager. Check the box at the bottom of the page confirming that you agree with the conditions of data processing in accordance with the GDPR, then click “Yes”:

After this, you’ll see a window with the GTM code fragment that needs to be installed on your website.

You can immediately copy the code and install it on all pages of the site that you want to monitor, or click “OK” and do it later when you add the first tags to the container. You can view and copy the code at any time under Administration → Install Google Tag Manager:

2. Install the Google Tag Manager Code on Your Site

If you’re familiar with website development and have access to the admin panel, it’s easy to integrate Google Tag Manager by adding the Tag Manager code. Otherwise, you’ll still have to ask for help from programmers; otherwise, there’s a risk of breaking the source code of the page.

The Google Tag Manager code consists of two fragments and is loaded asynchronously. That is, the main part of the page continues to load without waiting for the GTM container to load. The first part of the code should be placed in the page header, as close as possible to the opening tag.

This is because the higher the position of the first fragment, the faster it will load. If you insert it into the tag, then you risk losing data about users who leave the page before loading this tag.

The second part of the code works as a backup and helps to track the actions of users who have disabled JavaScript. It must be placed immediately after the opening tag:

Important!

The GTM code must be placed directly on the page you’re going to track, in other words, on your entire site. Placing code in a hidden iframe or deploying it in another tag management system will not allow tracking tags on the main page correctly.

Installing Google Tag Manager on an AMP page

If you use AMP technology to quickly load and adapt pages for mobile devices, then the first part of the code should be placed before the closing < /head> tag,

The second part of the code should be inserted immediately after the opening tag:

3. Publish the Container

Even if you haven't added a single tag to the container, we recommend publishing it immediately after installing the GTM code on your site. Otherwise, the container will cause a 404 error.

This isn't critical, however. If you're tracking JavaScript errors using certain services such as TrackJS, then 404 errors will litter your reports. In order not to cause unnecessary stress for developers, it's better to publish an empty container — it doesn't harm anyone.

To publish a container, go to the Workspace tab in Tag Manager and click the Submit button in the upper right corner.

Select "Publish and Create Version". Since this is the first version of your container, the Version Description field can be left blank. Next, click Publish:

Done. The container has been published.

Streamline Your Marketing Data in One Place

Connect, manage, and visualize all your marketing data easily with OWOX BI. Say goodbye to manual reports and hello to instant insights

Start Free Trial
Automate your digital marketing reporting

4. Check out Google Tag Manager

After adding the Tag Manager code to your site, you can check whether data is being transferred correctly using the Google Tag Assistant and the Tag Assistant Companion extension. Google Tag Assistant is a helpful Chrome extension that simplifies the process of confirming the installation of Google Tag Manager (GTM) on a website.

It assists users by highlighting whether GTM is correctly implemented, serving as a practical tool for users looking to verify their setup. The Tag Assistant Companion is an addition to the Chrome browser that shows which tags of Google products are installed on your site and how they work.

Install the Tag Assistant Companion Extension: You install the Tag Assistant Companion extension from the Chrome Web Store to your Chrome browser. After installation, you click on the extension’s icon in your browser toolbar to open its configuration panel.

Enable Tag Assistant in Google Tag Manager: Log into your GTM account and select the “preview” mode.

Now, enter your website’s URL, and enable it by selecting “Include debug signal in the URL.”

Use the Tag Assistant Companion: Now, the website will open on a new tab. After opening a website in a new browser tab, the extension activates to monitor and showcase data related to tags triggered through Google Tag Manager (GTM) on that specific page.

Analyze Tag Information: Once the monitoring process is complete, users can prompt the Tag Assistant Companion to display a summary of the fired tags along with any detected errors by issuing the command “finish.” Click on a tag to see detailed information, such as the trigger that fired the tag and any issues detected.

Troubleshoot Errors: If the Tag Assistant Companion indicates there are errors or warnings with your tags, click on the specific tag to get detailed information about the issue. Use the information provided to troubleshoot and fix the issue within your GTM account.

Validate Changes: After making changes in GTM, return to your website and refresh the page. Open the Tag Assistant Companion again to validate that the changes you made resolved any issues. The status of the tags should now show as successful, with no errors or warnings.

Continue Monitoring: As you continue to work on your website and GTM container, use the Tag Assistant Companion regularly to monitor the performance of your tags and ensure they are firing as expected.

Measure CPO and ROAS in GA4

Automatically link your Ad Platforms cost data to Google Analytics 4 conversion data, so you can analyze your marketing KPIs and make fully informed decisions

Start Free Trial
Automate your digital marketing reporting

How to Set Up Google Analytics 4 Using GTM

Setting up Google Analytics 4 (GA4) through Google Tag Manager (GTM) is an efficient way to track and analyze user behavior on your website. This method streamlines the process by allowing you to manage all your tags in one place, ensuring that your data collection is accurate and seamless. In this section, we'll walk you through the steps to integrate GA4 with GTM, helping you gain valuable insights into your website's performance.

Step 1: Create an account with Google Analytics 4

If you don’t have one yet. We’ve described how to do this in detail in our guide to setting up your Google Analytics account. Obtain your Google Analytics tracking code from the Admin section under Property Settings.

Step 2: Install the GTM container code on your website

Installing the Google Tag Manager (GTM) container code on your website is essential for managing tags efficiently. By adding this code to your site’s HTML, you enable GTM to deploy tags like Google Analytics 4 without directly altering your website’s code, streamlining your data collection process.

Step 3: Create a GA4 tracking ID variable

To do this, on the Workspace tab, select Variables → User variables and click Create. In the Variable type field, select the Constant option from the list, and in the Value field, enter the Measurement ID of the Google Analytics 4 resource that you want to transfer data to.

Create a name for the variable — let’s say GA4 Measurement ID — and save it.

Not sure where you can find your resource ID? Open Google Analytics 4, go to the AdminProperty Details → Select Data collectionData Streams → Web → Measurement ID, which is the tracking ID in GA4.

Step 4: Create a Tag

Create a tag that will send page view data to the Google Analytics 4 resource. To do this, go to the Tags section, click New, and select the Google tag configuration. In the Tag Configuration section, choose the Google tag option. Configure the tag by entering your Google tag ID in the designated field.

To prioritize the Google tag, choose the “All Pages” trigger under Triggering. This ensures the tag fires before other triggers when visitors load your website pages. In the configuration setting, specify the variable you created in step 3. Then select the embedded trigger All Pages and name and save the tag.

Step 5: Check if Google Tag Manager is working

After implementing the GTM code, ensure its proper installation by either viewing the page source and locating the “gtm.js” code snippet, enabling preview and debug mode in GTM to verify the appearance of the debug panel upon website refresh, or utilizing the Tag Assistant extension to confirm the presence of Google Tag Manager when enabled.

Step 6: Publish the changes that you just made to your Container

Publish the recent changes to your container. To do this, click the Submit button on the Workspace tab.

In the window that opens, specify the name of the new version of the container and click Publish.

Important! If you previously placed Google Analytics 4 on your site manually, you’ll need to delete it and, at the same time, publish the GMT container. Otherwise, data will be duplicated.

Step 7: Verify Data Transfer to Google Analytics 4

Check if data is being transferred to Google Analytics 4. To do this, log in to your Google Analytics 4 account and open the Real-time — Overview report. This report should begin to receive data:

Possible Problems When Working with GTM

  1. Problem: Tags work correctly in debug mode, but data isn't received by Google Analytics.
  2. Reason: An invalid tracking ID was specified in your Google Analytics 4 tag settings. Due to this, data isn't sent to the right resource.
  3. Solution: Enter a valid tracking ID. See step 3 for details.
  4. Problem: When switching to Google Tag Manager, the number of sessions and users dramatically increases.
  5. Reason: The GTM container has been published, but the manually installed Google Analytics code is still on the site. Data is being transmitted to Google Analytics 4 both through GTM and through the site code, so it's duplicated.
  6. Solution: Delete the Google Analytics 4 code on your site.
  7. Problem: You've made changes to the Google Tag Manager container, but you don't see them in debug mode.
  8. Reason: After each change, you must update the preview. Make sure you've done that. Or you might have several workspaces, and the preview mode isn't set for the one in which the changes were made.
  9. Solution: Update the preview. Check which workspace is in the preview mode.

Automate your digital marketing reporting

Manage and analyze all your data in one place! Access fresh & reliable data with OWOX BI — an all-in-one reporting and analytics tool

Start Free Trial
Automate your digital marketing reporting

Declare Independence from Developers with Custom HTML Tags in Google Tag Manager

Many marketing experts just love Google Tag Manager. But why wouldn’t they? It provides an easy way to place a new code on a website. Still, what are the other benefits of GTM?

In this article, we share ideas for the application of custom tags in GTM and explain how to use Google Tag Manager. Custom HTML tags make it easier to make changes to the website. This doesn’t mean, of course, that you can do without developers, but it will take less time, and you can proactively manage the process.

With Google Tag Manager, you can:

  1. Easily run A/B testing.
  2. Place new elements (e.g., banners) on the website. You can efficiently manage the content and, what is even more attractive, set up triggers to fire tags under any condition. You can even use different banners for different target audiences. For example, you can show a promo banner only to visitors from Chicago.
  3. Display different phone numbers depending on the user type, browser, or product category your users are browsing at the moment. For example, if a consultation on different product categories is provided by different call centers.
  4. Quickly add scripts you get from the developers when the script can be run separately, and it is necessary to retain the ability to modify it quickly. For example, system scripts install cookies or clear local storage.

Not to mention the fact that there are various A/B testing services and online chats that you can add or set up using GTM.

How to Set Up Custom Tags?

To set up custom HTML tags, use GTM to place a script on the website. To create a custom tag, sign in to your account, choose Tags, and click New. When choosing the tag type, click Custom HTML tag (you might have done this before when adding a partner's script to the website).

Now, you can place your own script in the editor window and press Continue

The next thing to pay attention to is choosing Fire on conditions.

This step is useful in that you can configure any condition to fire your tag (well, within reason, anyway...). For example, you can activate tags on certain product category pages, certain users (on the grounds of the city, authorization type, or the number of orders), or even target those users who have found your website via Google search. Note that the code will also be placed on every new page that appears on the website after the changes are made and fall under the conditions.

Or, for example, you want a discount banner to be seen by only those customers who have already made an order on the site. And by good fortune (or thanks to the sophisticated metrics system), the needed criteria (that the user has already made an order) is sent to Google Analytics 4. Just create the option that would work for you, and you are all set.

Please Note

One thing that should be kept in mind when using custom HTML tags is to always test the changes in Preview and Debug mode. This will help you avoid many problems if something goes wrong.

Some possible difficulties you may face when adding custom HTML tags to the website:

  1. Layout can be broken on some pages or in some browsers;
  2. JS errors may occur due to the use of global variables or attempts to use non-existent ones;
  3. New scripts can delay the loading of the main content of the webpage or interfere with the other elements of the website.

If you have any of the above problems, it's better than likely that you need to edit the script and possibly even ask for advice from a fellow developer.

Uncover in-depth insights

Comprehensive Guide: Set up GA4 Tags using Google Tag Manager

Download now

Bonus for readers

Comprehensive Guide: Set up GA4 Tags using Google Tag Manager

Useful Links and Examples of Tasks You Can Solve with Tag Manager

Google Tag Manager, in conjunction with Google Analytics 4, gives you a flexible analytics system and allows you to customize the collection of almost any data from your site. We’ve prepared a selection of articles on this topic. Find out what other problems you can solve using GTM.

  1. How can you handle repeat transactions in Google Analytics 4? — Learn the reasons for repeat transactions and read our guide on how to set up GTM to avoid duplicate data.
  2. The site is not enough: a guide to mobile app analytics — Read about how to track the installation of mobile applications using Google Tag Manager.
  3. A comprehensive guide to enhanced e-commerce tracking in Google Analytics 4 — Set Enhanced E-commerce in Google Analytics with the help of GTM.
  4. How to set up dynamic remarketing in Google Ads via Google Tag Manager — Learn how to do this with a step-by-step guide.
  5. Google Tag Manager tutorial — A comprehensive guide covering essential concepts, installation processes, advanced configurations, debugging, and testing tags and triggers.

We also have a webinar called Expert Tips and Techniques for Using Google Tag Manager, in which we clearly explain how to:

  1. Track JavaScript errors that prevent your site visitors from doing what they want to;
  2. Track scroll depth to determine the effectiveness of sections and authors, and to track the effectiveness of pages that take up multiple screens;
  3. Prevent duplicate transactions in Google Analytics 4;
  4. Use tag Sequencing, Workspaces, Approvals, and other useful options in GTM.

Key Takeaways

Add the new tool to your kit to make changes to the site quickly so that you can manage the content more flexibly using different conditions to fire the tags.

Just use common sense, and don't try using GTM as a full-fledged tool for A/B testing or personalization. More convenient solutions are specifically designed for these purposes.

Streamline Your Marketing Data in One Place

Connect, manage, and visualize all your marketing data easily with OWOX BI. Say goodbye to manual reports and hello to instant insights

Start Free Trial
Automate your digital marketing reporting

FAQ

Expand all Close all
  • How do you add Google Tag Manager to your website?

    To integrate Google Tag Manager (GTM) into your website, first, sign up for GTM and create a new account specifying your website's domain to generate a unique GTM code. This code consists of two snippets: one for the section and another for the tag of your HTML. Insert these snippets exactly as provided into every page of your website to enable GTM functionalities across your site.
  • How do I know if Google Tag Manager is installed on my website?

    To confirm the installation of Google Tag Manager on your website, inspect the page's source code by right-clicking the webpage and selecting 'View Page Source' or using the 'Inspect' tool. Look for the 'GTM-' prefix within the code, indicating GTM's presence. Alternatively, Google Tag Assistant, a Chrome extension, can simplify this process by highlighting whether GTM is correctly implemented on the webpage.
  • Can I add Google Tag Manager to Google Sites?

    Unfortunately, Google Sites restricts direct editing of HTML code, which is necessary for adding the Google Tag Manager (GTM) code snippets. This limitation means you cannot directly implement GTM on a Google Site using the standard method of inserting GTM code in the site's header and body. For advanced tracking, consider other platforms or indirect methods that comply with Google Sites' capabilities.
  • What is Google Tag Manager on the website?

    Google Tag Manager is a powerful tag management system designed to simplify the process of updating and managing tags – small blocks of code or tracking pixels on a website or mobile app – without needing to edit the site's code directly. It facilitates the efficient deployment of analytics and marketing optimization tags, allowing for quick updates and the ability to test new tags with ease, thereby enhancing digital marketing strategies.
  • How do I trigger Google Tag Manager?

    In Google Tag Manager, triggers define the conditions under which specific tags should be executed. These can be configured for a variety of scenarios, such as page views, clicks on links or buttons, form submissions, or custom events like video plays. By setting up triggers, you can control how and when each tag is activated, allowing for precise data collection and targeted marketing actions based on user interactions with your site.
  • How to install GTM on a website?

    To install GTM on your website, sign up for GTM and create a container for your site, obtaining a unique GTM code. This code includes two snippets: one for the section and another for the opening tag of your website's HTML. Insert these snippets on every page of your site to activate GTM. This setup enables tag management without altering the site code directly for each tag update.
  • How to add a Google tag to my website?

    To add a Google Tag (such as Google Analytics) to your website using Google Tag Manager (GTM), first, create a new tag in your GTM dashboard. Select the specific Google service (e.g., Google Analytics) and configure the tag with the required information (like your tracking ID). Assign a trigger, typically 'All Pages' for site-wide tracking. Save and publish the tag to activate it on your website.
  • What are the benefits of using Google Tag Manager?

    • Simplifies tag management, eliminating the need for coding skills.
    • Enhances website speed by loading tags asynchronously.
    • Facilitates precise and flexible tracking configurations.
    • Enables efficient A/B testing and marketing optimization.
    • Offer a centralized system to oversee numerous tags efficiently.
    • Reduces errors and improves collaboration through streamlined workflows.
    • Allows quick updates and deployment of new tags without IT involvement.
    • Improves data accuracy and decision-making with better tracking capabilities.
  • Do I need coding skills to install Google Tag Manager?

    No, you don't need advanced coding skills to install Google Tag Manager (GTM). The process involves creating a GTM account, setting up a container for your website, and then copying and pasting the provided code snippets into the HTML of your website's pages. Basic knowledge of HTML and how to access your site's backend to edit the code is sufficient.