Google Tag Manager (GTM) is a free and open-source service that allows users to monitor, measure, and optimize the performance of their web pages. It was introduced on the Adwords platform in 2011 and has grown to become the most used tag management system over the internet. Google Tag Manager is a tool that allows you to install, manage and update code on your website. Each tag is called a “Google Tag”, which can profile visitors and track events as they happen.
What are Google tags
Google tags are invisible HTML/JavaScript/CSS codes embedded in websites for tracking, reporting, and analytics without installing any dedicated client. A web address identifies the Google tags appearing on web pages optimized for Googlebot, the search engine's user agent. All the tracking attributes, such as page views, time spent on site, and user engagement, are available in website analytics reports.
Main components of GTM
Tags
A GTM Tag is a snippet of code. Code snippets come from external sources that integrate tools, support, platforms, and other support with the website. GTM has preset configurations for all platforms like Google AdWords, Google Analytics, etc.
How to find a GTM tag
Go to “Tag Manager”, click on “Workspace”, and click on “Near the top of the window”.
For example - “GTM-XXXXXX.”
Triggers
It is a specific action that enables the tags to FIRE or collect the appropriate data and send it to the appropriate location. A trigger is nothing but an action performed on different Tags. Examples of common triggers include clicks, form fills, or page views.
Variables
It provides specific information about the action of a tag. GTM variables have two types:
Built-in variables: These variables are pre-configured by GTM. Some common variables in this category include Click Text, Form Classes, and Page URLs.
User-defined variables: The end-users have to manually set up these variables. A user-defined GA Settings variable sends data to a specific Google Analytics account.
Common variables of GTM
- Data Layer Variable
- Auto-Event Variable
- Constant Variable
- Google Analytics Settings Variables
- Refer URL Variables
Common tags of GTM
- Google Analytics.
- Google Ad-Words.
- Facebook Tracking Tools.
- Heatmap tracking code.
- Custom HTML scripts.
Google Analytics
Google Analytics is a platform and web analytics service that tracks and collects data from applications or websites and generates reports.
Types of Google Analytics
Universal
Interest
- The page visited by the user.
- The product searched by the user.
Interaction
- The action taken by the user.
- The info on the page searched by the user.
Conversion
- The process of checking product -add to cart- purchase.
Drawbacks
- We can track data either on the web or mobile at a time. We cannot track data for both simultaneously.
Universal mainly focuses on the total number of user traffic in most of the reports. To overcome this, we use GA4.
GA4
- GA4 is an updated version of Universal.
- We can track data simultaneously for web and mobile with GA4.
- Universal mainly focuses on the total number of users in most reports, whereas GA4 shows the active traffic in most reports.
- GA4 includes automatic tracking of all activity done by the user, including Scrolling, Clicking, and Videos Watched.
Commonly used plugins for testing
Data Layer Checker
We can check and track all activity from the current page. We don't need GTM ID to track all data in the Data Layer Checker. For example, from the checkout page to the purchase page.
Steps to use Data Layer Checker for testing
- Install Data Layer Checker (Chrome Extension)
- Open Website
- Click on Data Layer Checker
- Check Result
What to check in Data Layer Checker
It depends on the requirements of data tracking. We can track all activity on any website; Clicking, Sorting, Scrolling, & Applying Filters. In Data Layer Checker, events are tracked automatically.
Common data check-in
- Language
- Country
- Site name
- Page Name
Common data check-in list after login
- Email ID
- Phone No
- Cust. Type - New/Old
- User Name
- User Type [Logged In User]
Example
If you have a button on your site, that when clicked, should send an event to the Data Layer Checker with the category "About Us" and the action "Click". To test this, follow these steps:
- Open the ILAO site in a browser.
- Click on the Data Layer Checker icon in the browser's extensions to open it.
- Click on the Data Layer extension to start checking.
- Click on the Donate Now button, which will send the event to Data Layer Checker.
- Check the Data Layer Checker for a message indicating that the event was sent with the category "About Us" and the action "Click".
- Verify that the event was recorded by checking the Real-Time reports in Data Layer Checker.
You should see the event in the "Events" section with the category "About Us" and the action "Click".
Drawbacks
- If we redirect to another page then we can not track that activity.
- Data Layer Checker is time-consuming.
To overcome this we use GTM/GA Debugger.
GTM/GA Debugger
To check using GTM/GA Debugger we need a GTM ID and JS code to track all data. Using GTM/GA Debugger we can track all types of data like the current page, previous page, and all actions.
Steps to check GTM ID
- Inspect Page-> CTRL + F-> GTM.
For example- “GTM-TDJNTQL.”
Steps to use GTM/GA Debugger for testing
- Install Analytics Debugger (Chrome Extension)
- Open Website
- Open DevTool [ctrl+shift+c]
- Click on Analytics Debugger
- Start Debugging
- Check Result
Things to check in GTM/GA Debugger
It depends on the debugging tracking requirements. We can track all activity on any website; Clicking, Sorting, Scrolling, & Applying Filters. Events are tracked automatically in Data Layer Checker, and we have to check all events in the GTM/GA Tab.
Common data check-in GTM/GA Debugger
Add any product to the cart to see a list of results.
Checkout Page [Event generated for every action]
- Cart Amount
- Name [Product name]
- Price [Product price]
- Discount Percentage [Product discount percentage]
- Brand [Product brand]
- Category [Product category]
- Variant [Size/Year]
- Quantity
Example
Let's say you have a button on your site that, when clicked, should send an event to GA with the category "Get Legal Help" and the action "Click". To test this, follow these steps:
- Open the www.ilao.com site in a browser.
- Open GTM by clicking the GTM icon in the browser's toolbar.
- Start debugging by clicking the Debug button in GTM.
- Click the button that should send the event to GA.
- Check the GA Debugger console for a message indicating that the event was sent with the category "Get Legal Help" and the action "Click".
- Verify that the event was recorded by checking the Real-Time reports in GA.
You should see the event in the "Events" section with the category "Get Legal Help" and the action "Click".
Drawbacks
- Without GTM ID, we can not track any data in GTM/GA Debugger.
- Sometimes we can't track data even with a GTM ID due to code issues.
Summing up
Google Tag Manager is a powerful tool for managing website tags and tracking data without modifying the website code. With GTM, you can easily set up tracking for various marketing and analytics tools, create custom tags, and manage all your website tags in one place. It saves time and resources and helps understand your website visitors' behavior better to optimize your website accordingly.