SEO News

What is Google Tag Manager & How Does It Work?


What Is Google Tag Manager?

Google Tag Manager (GTM) is a free tool that enables you to install, store, and manage marketing tags without modifying website code. 

Marketing tags are small snippets of code that track user actions and collect data. 

The most common example of a marketing tag is the Google tag used to install Google Analytics and other Google products.

Other common examples include Google Analytics event codes, Google Ads conversion scripts, Meta Pixel code, and remarketing tags.

install the google tag manually

You need to place tags like these in your website code for Google Analytics and other platforms to function and collect data.

But with every addition and code change, you risk forgetting about, losing, or breaking tags (or other website elements).

GTM mitigates these issues by allowing you to install, manage, and deploy marketing tags from within its software instead of in your website code.

And the software injects code snippets and marketing tags into your website code only when necessary.

So you won’t accidentally break your website by testing something.

What Is Google Tag Manager Used For?

Tag Manager allows you to to track almost any kind of event or user behavior you can think of.

Here are some examples of commonly tracked events:

  • Link clicks
  • Button clicks
  • Form submissions
  • Conversions
  • Shopping cart abandonment
  • Adding items to cart
  • Removing items from cart
  • File downloads
  • Scroll behavior
  • Video views
  • Call to action (CTA) performance
  • Table of contents (TOC) clicks
  • Custom events

How Does Google Tag Manager Work?

Google Tag Manager works by using a single JavaScript code snippet that you add to your site as a container for all the tags you want to manage.

When a user triggers a tag (e.g., by clicking a link or loading a page), GTM retrieves it and injects it into your website code.

Then, GTM executes the tag.

In other words, GTM only injects and executes a tag when a user triggers one. This reduces the overall amount of code on a website and minimizes the risk of implementation errors.

benefits of using gtm

Tags work with other GTM components called triggers and variables to determine when to execute code snippets.

Let’s discuss what tags, triggers, and variables are. And how they work.

What Are Tags?

Tags are snippets of code analytics, marketing, and support platforms use to integrate with sites and apps.

Google Analytics, for instance, uses tags to collect data on website visitors.

In this case, the Google tag lets you send data from your site to a connected Google Analytics property.

Through GTM, you can create, manage, and publish tags without having to code them yourself.

choose tag type

Examples of Tags

The following are examples of commonly used tags. These are tools and platforms often installed with GTM:

  • Google Analytics
  • Google Ads Conversion Tracking
  • PageImprove
  • Crazy Egg
  • Hotjar
  • ImpactHero
  • Pinterest Tag
  • LinkedIn Insight
  • Twitter Universal Web Tag
  • Facebook/Meta Pixel
  • SplitSignal
  • Appcues
  • HubSpot
  • Intercom
  • Mixpanel
  • Salesforce
  • Custom events and tracking

What Are Triggers?

Triggers are instructions for when tags should fire.

Page views, form submissions, and link clicks are common examples of triggers. When a user views a page or clicks a link, the associated tag will fire.

You need to assign a trigger to every tag so Tag Manager knows under what circumstances to fire the tag. 

Analytics platforms like Google Analytics typically use page views as a trigger. You want analytics data from every page a user visits.

Alternatively, you might only want a conversion tracking tag to fire when a user places an item in their cart. Or perhaps when they complete the checkout process. 

When each tag’s specified event occurs, its trigger tells the tag to fire.

Otherwise, that tag will not fire. And GTM won’t execute the code snippet.

You can also add filters to triggers to specify when you want tags to fire.

For example, you may only want your support chat to fire on pages in the checkout funnel.

In this case, you could add a filter that tells the tag to only fire on page views of pages with “/checkout/” in the URL. 

You can assign multiple triggers to a single tag.

assign triggers to tags

Examples of Triggers

Here are some of the most commonly used triggers:

  • Page views
  • Link clicks
  • Button clicks
  • Form submissions
  • Scroll depth
  • Time spent on page
  • Custom event 

What Are Variables?

Variables are additional pieces of information that GTM may need to fire a tag or trigger.

They help define precisely what the tag or trigger is supposed to do.

For example, “Constant” and “Google Analytics Settings” are common variables.

They are both typically used to define Google Analytics account IDs (i.e., “Tracking ID” in Universal Analytics and “Measurement ID” in GA4).

Every time you create a Google Analytics tag, you need to enter your tracking or measurement ID. 

This can get tedious, as most of us don’t memorize these IDs.

Instead, you can create a variable that simply stores your ID.

Then, whenever you create a new tag that requires this information, you simply attach the variable you created.

variables overview in gtm

Examples of Variables

The following are some of the most common variables:

  • Constant
  • Google Analytics Settings
  • Click URL
  • Click ID
  • Click Class
  • Page URL
  • Form ID
  • Scroll depth threshold

Benefits of Google Tag Manager

While Tag Manager requires some technical knowledge, it saves marketers tons of time and resources.

And it’s free.

Here are some benefits:

  • Reduced reliance on developers: Quickly and simply add and manage marketing tags without developer assistance
  • Testing and debugging: Preview, test, and debug changes before pushing them to a live site. This feature helps prevent errors and reduces the need for testing on a live or staging site. 
  • User permission control: Only authorized people can make or approve changes to your marketing setup
  • Versions: GTM creates and logs a new version of the code whenever you publish changes. This allows you to view past and present changes and revert to previous versions if necessary. 
  • Workspaces: GTM enables multiple workspaces for team members to work simultaneously without overwriting each other’s progress
  • Easy configuration of many popular tools: Easily add tools and tracking tags to your website code using code snippets or existing templates (e.g., for Google Analytics, Pinterest, Google Ads, etc.) from the Community Template Gallery
  • Tag storage and management: Google Tag Manager consolidates marketing tags and tracking codes in one place and injects them into website code as needed. Which allows you to add, remove, and update tools and tracking codes with fewer errors.

Google Tag Manager vs. Google Analytics

Though often confused, Google Tag Manager and Google Analytics are different tools you can use together to collect and report on web analytics and user behavior. 

Google Tag Manager is a tag management system that stores and manages marketing tags and third-party code snippets. 

There are no analytics or reports in Tag Manager.

Google Tag Manager home

Google Analytics, on the other hand, is software used for analytics, conversion tracking, and reporting.

Google Analytics home

You can use GTM to install and deploy Google Analytics on a website. (Google recommends doing this.)

Do You Need to Change Anything for Google Analytics 4?

Yes. If you are using GTM to install Google Analytics 4 (GA4), you’ll need to install the “GA4 Configuration” tag.

Aside from that, using Google Tag Manager with GA4 is very similar to using it with Universal Analytics (UA).

One of the main differences is that Google now provides a separate tag for GA4 events.

Previously, you’d implement UA and track events using the same tag. 

Another difference is that GA4 can automatically track and collect many more events than UA on its own.

Which means less need for manual event tracking in GTM. However, you can still use GTM to track anything GA4 doesn’t provide.

Tag Manager and GA4 work seamlessly together. 

Tip: Read Google’s guide on moving from UA to GA4 for additional information.

How to Set Up Google Tag Manager

To set up Google Tag Manager, log in to your Google account and go to Tag Manager.

Click “Create Account” to create an account for your business or organization.

create account button highlighted

Enter an “Account Name” and select your country. Google recommends that each business create only one account—whether you have one website or multiple. Your company name can serve as your account name.

account setup

Next, enter a “Container name.” 

Container name box highlighted

Your container is the piece of code you will add to your website to make Google Tag Manager work. You will typically use one container per website. So your container name can be your website name or URL.

Then, select your “Target platform.” For websites, choose “Web.”

select target platform

Click “Create” to make your Tag Manager account and your first container. 

Next, you’ll see two pop-ups. 

The first is the Google terms of service. Agree to the terms by checking the box at the bottom of the page. And clicking “Yes” to accept at the top right corner of your screen.

agree to google terms

The second pop-up displays the code snippets you need to add to your site to install GTM.

code snippet to install gtm

Note: If you’re not comfortable modifying your website code, ask a developer for assistance.

The first code snippet uses JavaScript to extract information. Place that snippet as high in the <head> section of your website pages as possible.

how to add code snippet to your website

The second snippet is an HTML iframe. Place that code immediately after the opening <body> tag on your webpages.

Like this:

how to add code snippet to your website

(The HTML iframe element ensures that GTM still works when users disable JavaScript in their browsers.) 

Once you’ve set up your account and properly installed the two code snippets, you’re ready to start using Google Tag Manager. 

Pro tip: Use the Tag Assistant Legacy extension to ensure your Tag Manager implementation is correct.

How to Use Google Tag Manager

To demonstrate how to use Google Tag Manager, we’ll walk you through how to connect a Google Analytics 4 property to your site.

Pro tip: To prevent your analytics from registering double hits, ensure you’ve installed Google Tag Manager and have removed the original Google Analytics code from your website before proceeding.

To begin, log in to your Google Tag Manager account.

Click “New Tag” or “Add a new tag” to create a new tag.

create a new tag in gtm

Add a name for your tag. We suggest something like “GA4 Configuration.”

choose a tag name

Next, click on “Tag Configuration.”

Tag Configuration highlighted

And select “Google Analytics: GA4 Configuration” from the list.

select Google Analytics: GA4 Configuration

Enter the measurement ID for your GA4 property. Alternatively, you can create a variable to house your measurement ID for future use.

measurement ID box

Click the “Triggering” box.

Triggering box

And select “All Pages” from the list that pops up.

all pages

Then click “Save.”

save button

Go back to your workspace overview page and click “Preview” to test your new changes.

test new changes by clicking preview

Enter your website’s URL in the next screen and click “Connect” to open your site in a new window and begin testing and debugging.

connect button

Once you’re connected, your site should open in a new pop-up. With the Tag Assistant in the lower right corner of your window.

tag assistant connected

Keep that window open and return to the preview page. The preview page should say, “Connected!”

Connected! page

After you hit “Continue,” start debugging your tags in the preview window.

start debugging your tags

You should see your newly created GA4 Configuration tag firing on each page as you navigate your website.

This means your tag implementation was successful.

When you’re done debugging, close the newly opened windows and go back to your page overview. And click “Submit” to submit your changes.

submit changes button

Be sure to give your changes a descriptive “Version Name” and “Version Description.”

Version name and description boxes

Lastly, click “Publish” to push your changes to your live website and enable GA4.

This will publish a new version of your container to your website.

You should now see hits registering in the “Realtime” report of your GA4 property as you and other users navigate the website.

Realtime overview

Pro tip: We strongly recommend always using the “Preview” function to test and debug your tags before you publish them.

Best GTM Extensions

Browser extensions help you get more out of Tag Manager. 

The following extensions provide additional information on the tags that are firing (or not firing) and any issues that arise with your implementations.

They also provide important details regarding your variables, triggers, and code snippets. 

The following extensions are some of the best for facilitating your GTM efforts:

Streamline Your Marketing Setup

Google Tag Manager is a versatile tool that can simplify the process of installing and managing marketing tools and tracking important events.

We recommended reviewing a Google Tag Manager tutorial before migrating entirely over to the platform. 

Once you get acquainted with it, Tag Manager is a wonderful addition to any marketing stack.

Pair GTM with powerful tools like Google Analytics, Google Search Console, and Semrush’s Site Audit tool, and you’ll have everything you need to run a streamlined marketing strategy.



Source link : Semrush.com

Related Articles

Back to top button
Social media & sharing icons powered by UltimatelySocial
error

Enjoy Our Website? Please share :) Thank you!