Google has made it their business to provide outstanding and free tools for marketing experts or professionals as well as website owners to use at all times. One of those tools is the Google Tag Manager, and in this Google tag manager tutorial, you will learn all you need to know about the tool and its effect on your online business.
You will also learn how to setup and install Google tag manager and its difference from Google Analytics.
What is Google Tag Manager?
Google Tag Manager is a free and innovative tool that allows users to readily manage and deploy marketing tags – i.e. tracking snippets or snippets of code – on your mobile application or website without necessarily modifying the code.
Information obtained from one data source – such as your website, etc. – can be shared with another source of data, i.e. Google Analytics via Google Tag Manager. This remarkable tool is quite handy for anyone with a lot of tags to manage since all the code is stored only in one place.
One vital benefit of Google Tag Manager is that marketers can easily manage the code on their own. The services of developers in this aspect will not be required. That may sound somewhat easy or be a walk in the park, but this is far from the truth. This is why we want to cover how to setup and install Google tag manager to help you improve your website.
Is Google Tag Manager Easy to Use?
Google has stated that the Google Tag Manager helps to make tag management easy, simple, and reliable by allowing webmasters and marketers to deploy tags in one place.
When you read the word ‘simple’ in that sentence, one may be forced to believe it is effortless. But in reality, Google Tag Manager is not all that easy to use, especially if the user has no technical training or knowledge.
This means that the searchers are indicating with their relevant search that they are interested and ready to buy something online, and if you sell those things, you will be in the position to make money.
If you want to know how to setup and install Google Tag Manager, you need to, first of all, possess some technical knowledge in order to understand how to set up triggers, tags, and variables. For instance, if you need to drop in Facebook pixels, it is essential that you fully understand how Facebook tracking pixels work.
What about setting up event tracking in Google Tag Manager? The same rule applies; you will need valid knowledge about what ‘events’ are as well as how Google Analytics works. You will also need to know what data you should track with events as well as what the reports actually look like in Google Analytics and how to name your actions, categories, as well as labels.
Although it may be easy to manage multiple tags in Google Tag Manager, it implies that there is a learning curve you need to surmount. And once you do surmount it, Google Tag Manager becomes pretty slick when it comes to what you can track.
So, how does Google Tag Manager work? First of all, there are 3 significant parts to Google Tag Manager, namely:
- Triggers: This informs Google Tag Manager how or when to fire a tag
- Variables: Additional information Google Tag Manager may require for both the tag and trigger to work.
What Makes Google Tag Manager Different from Google Analytics?
Google Tag Manager is not the same as Google Analytics. The former is a tool that is employed for storing and managing third-party code. In Google Tag Manager, there are no reports or any way to carry out any analysis.
Google Analytics, on the other hand, is used for fundamental analysis and reporting. All conversion tracking filters or goals are generally managed via Analytics. All reporting – which includes custom segments, conversion reports, eCommerce sales, bounce rate, time on page engagement reports, etc. are carried out in Google Analytics.
Once you understand how to setup and install Google tag manager then you will have a better website.
Google Tag Manager Tutorial: How to Setup and Install Google Tag Manager
To get started with how to setup and install Google Tag Manager, the first step in this Google tag manager tutorial is to create a Google Tag Manager account. Visit the Google Tag Manager website and click on the blue-colored tab labeled ‘Start for free’ which is the main call-to-action on that page.
You will be required to use the same Google account for Tag Manager, just like with any of Google’s products. That implies that if you already own a Gmail (Google Analytics, Google Ads, etc.) account, you will be logged in automatically to Google Tag Manager. But if not, you may have to create a Google account first before proceeding. We will not go into detail about this aspect in this Google Tag Manager tutorial.
As soon as you are logged, you will be asked to create a new Google Tag Manager account as well as a new container. The account works much the same way as your Google Analytics account, which is usually for a business/company/client. A container, however, is generally for an app or a website. One container can contain several tags, triggers, and variables.
If several websites belong to a particular business and they have a similar structure – including their tracking implementation, etc. – you can use one container for multiple sites.
Finding the Google Tag Manager Code
Google Tag Manager provides users with the precise code and instructions on where to add it to your site. You can find this code in 2 different places:
- By clicking the container ID link which is located next to the 'Publish' and 'Preview' buttons.
- Or by navigating to Admin > Account > Container > Install Google Tag Manager.
Any of these options will open up instructions on how to setup and install Google Tag Manager code on your site plus the code snippets that you need to add to a website.
Adding Google Tag Manager Container Code t the Website
Follow these instructions by placing the first code – which is surrounded by script tags – right somewhere between head tags of your site. This code is the crucial part as it informs your page to load your Google Tag Manager container serially. This implies that while Google continues with its magic, the rest of the page continues loading.
It is important to note that although you can place both codes in the body, you should never add both of them in head. As mentioned earlier, the noscript section renders an iframe that is not permitted in head, or else you will end up with an invalid website’s HTML.
The possible options you may consider are as follows:
- script code added to the head and noscript to the body
- Both script and noscript codes are added to the
Check for the Availability of Google Tag Manager Plugins
If you are making use of any of the popular CMS (Content Management System) that allows the use of plugins, there is an excellent chance that you will come across a plugin that easily installs Google Tag Manager for you. All you will be required to do is to add your container ID.
Some examples of Google Tag Manager plugins include:
- WordPress: GTM4WP
- Magento: A bunch of them exists here
- Shopify: Several plugins here as well
These plugins will save you a lot of time when it comes to how to setup and install Google Tag Manager. Some platforms like Wix offer built-in Google Tag Manager integration as well.
But then, if you prefer manual installation – with or without the input of a developer – you will need to bear the following in mind:
Why Should You Place the Google Tag Manager Code in head?
Although this requirement is not set in stone, it is usually highly recommended that you place the script part of Google Tag Manager code into head of your site.
The primary reason for this is that it is much better for tracking. The higher up on the page that snippet is, the faster the page loads. It was recommended in the older version of Google Tag Manager to place the snippet within the body tag, but this would eventually miss visitors who left your website or page before the body tag loads, which is usually a result of slow page speed.
If you run a heavy website, it will take a few seconds for Google Tag Manager to start loading up in body. Still, it will be initiated much faster in head thereby enabling you to catch more visitors in order to see how they behave. This may end up empowering you to quickly identify the correct percentage of traffic that bounces right off your pages even before the page loads completely.
Bear in mind that the lower your tracking codes are placed within the website’s code, the later the tracking codes will be launched.
Publishing the Container
When you place the code on your site, navigate to your Google Tag Manager account, and publish the container, especially if it is empty. The reason behind this is that unpublished Google Tag Manager will eventually cause an error which is usually visible in the browser's console.
You will see something like the following:
404 not found for GET: http//www.googletagmanager.com/gtm.js?id=GTM-xxxxx
This indicates that your browser is urgently requesting data from Google’s servers, but no data will be returned since that particular container is still unpublished.
Checking if Google Tag Manager is Functional
After implementing the Google Tag Manager code on a webpage, you need to ensure that it was correctly installed. Choose from any of the following options:
- On your website, right-click on its background, and then choose ‘View page source’ and find the code by looking for ‘gtm.js’
- Enable the preview and debug mode in order to see whether or not it appears on the screen. Click the ‘Preview’ button located at the top right corner of the Google Tag Manager interface. Then, move over to the website to refresh it in order to check whether or not a Google Tag Manager preview and debug panel appears right at the bottom of the screen.
- Then, make use of the Tag Assistant extension to check whether or not Google Tag Manager is displayed as soon as you enable.
Use the DataLayer If You Need Custom Data on Every Page
When Google Tag Manager code is placed on your site, it will automatically create what is known as a Data Layer.
The dataLayer is like a virtual layer of your site which contains several data points. With its help, Google Tag Manager will be able to read, push as well as transfer data between your site and other tracking tools.
Do you want to push some data to the dataLayer when the page loads? Then you need to place the data above Google Tag Manager. If you do not possess coding skills, however, it is highly recommended that you outsource this work to an experienced developer. This is because blindly copying and pasting will not work in any way.
There must be a particular logic written that adds basic dynamic information to the dataLayer. For instance, if a user logs in, their actual customer type should be added to the Data Layer.
Data Layer is not such an easy concept to grasp for those who are just starting or beginners. You may have to read or get more experience to learn more about this aspect.
By now, you already know how to setup and install Google tag manager. Although this may not be an in-depth Google Tag Manager tutorial, you should have a rough idea of how to use Google Tag Manager in website.
Once you have a good understanding of the Google tag manager tutorial, then you can easily implement it on your website.