Google Tag Manager (GTM) for Beginners - Part 3

In the previous installment of our Google Tag Manager for Beginners guide, you have installed the GTM code on your website and then tested whether or not Google Tag Manager could connect to it. In this part of the guide we will establish a connection between GTM and Google Analytics 4 using the Google tag.

Note: In this guide we will use the terms 'Google Tag Manager' and 'GTM' as synonyms. In case we use 'GTM', you can read this as 'Google Tag Manager'. This also applies to 'Google Analytics 4' and 'GA4'.

Note: Google has a habit of regularly changing the interface of Google Analytics 4. This means that the GA4 interface in our images may look different compared to the GA4 interface in your browser. This usually results in minor aesthetic differences, but in some cases, Google has moved around entire features. If you can't find the specific feature we are highlighting, please consult Google to see where the particular feature has been moved to.

This time, we will start in Google Analytics 4. Log into your GA4 account here. If you haven't created a GA4 yet, please follow these steps before continuing.

After you having logged into your Google Analytics 4 account, go to the admin section by clicking the gear icon in the bottom left.

In the admin section you will either have to click on 'Data streams' in the menu on your left-hand side, or, alternatively, in the Data collection and modification section to the right.

To be able to receive data in your GA4 property, you will need to create a data stream. A data stream, in this context, is the data input for the property, i.e., where the data comes from. To create a new stream, click on 'Add stream' at the top right.

Since the data will be coming from your website, choose 'web' in the drop-down menu.

On the next screen, enter your website URL and create a name for your stream. The 'https://' part has already been filled in for you. Below that, you will have the option to enable enhanced measurement. If you enable this option, Google Analytics 4 will automatically measure certain events for you. If you would like to learn more about enhanced measurements, please read this article. After you're finished, click the 'create stream' button.

You will then see a screen where you where you can connect your website builder or CMS to Google Analytics 4, or where you can get your GA4 tracking code from to install on your website. However, this does not apply to us, because we are going to connect your website to GA4 with the help of Google Tag Manager, so you can close the pop-up.

The only thing you do need is your 'Measurement ID'. We will need this later, so click the icon next to it to copy your measurement ID and paste it in Notepad or something similar.

We have almost finished the connection between your website and Google Analytics 4. To establish the connection, go back to Google Tag Manager.

In the Google Tag Manager overview screen, click the 'tags' button.

We are going to create a tag. As a reminder, tags are pieces of code you want to have loaded every time specific conditions (triggers) are met. In this case, we are going to create a Google tag. (Previously known as the GA4 configuration tag.) This tag ensures that your website data will end up in your Google Analytics 4 property. Click the 'new' button to create a new tag.

You will then see a screen with two large areas called 'tag configuration' and 'triggers'. Click anywhere in the tag configuration field that isn't the blue 'more information' link.

Next, you will be presented with a list of different types of tags. These are tag templates; predefined templates you can use to create and configure tags. Using tag templates will save you a lot of time, because you don't have to create them yourself. In the list of tag templates, click 'Google tag'. This is the tag that ensures the data flow from your website to GA4 (and other platforms).

At the end of the previous step you have been asked to copy your Google Analytics 4 measurement ID. This is where you will use it. Copy your GA4 measurement ID under 'tag ID'. For this beginner's guide, you can leave the rest of the settings as is.

After having entered your GA4 measurement ID, click anywhere on the 'triggering' field below that is not the 'more information' link. This will let us choose a trigger for our Google tag. As a reminder, a trigger controls when a tag will fire. It is the condition that must be met on your website for the tag to become active and execute.

There will be several trigger options. It's even possible to create a trigger yourself by pressing the + sign at the top right corner. In our case, we will choose 'Initialization - All Pages', because we want our Google tag to fire as early as possible on every page of your website.

Note: Nowadays, a lot of websites are equipped with cookie banner, a notification on the use of cookies. Cookies are pieces of code which are stored on the computer or smartphone of your visitors during their visit to your website. In view of the GDPR and CCPA legislation, there might be requirements for you to adhere to when it comes to informing your website visitors about your website's use of cookies, and perhaps even have to ask for consent before doing so. Although Google is slowly but surely moving towards a future without cookies, we are definitely not there yet. By configuring the trigger so that the tag is only activated after your visitor has given permission to place cookies, you can comply with the GDPR legislation. Unfortunately, this is beyond the scope of this Google Tag Manager for beginners guide. Please note that it is your responsibility to comply with any laws applicable to your specific situation.

Next, come up with a name for your tag. We have chosen the name 'Google Tag' followed by our GA4 measurement ID. When you're finished, click 'save' at the top right corner to save the tag. When the Google tag goes live, it will fire everytime your website visitor loads one of your website pages (during the initialization phase). Then, the data will be sent to the GA4 measurement ID you have entered above.

Now that we have finished creating our Google tag, we will need to test whether or not the tag works. You will almost always have to test every change you have made before you will let the change go live. This testing is done in the Google Tag Manager preview mode. Not only does preview mode allow you to check whether or not the tag is actually working, it also allows you to check if the right data is being collected and sent to the right places. If this is not the case, you may accidentally collect distorted data. To start the GTM preview mode, click the 'preview' button.

To test the tag, click 'preview', just like we did when testing the GTM code in part 2 of our Google Tag Manager for beginners guide.

Enter the URL of your website and click 'connect. Since you were able to establish a connection between the container on your website and Google Tag Manager in part 2 of the guide, this shouldn't be a problem. If you do run into problems, please consult this article.

After a connection has been established between Google Tag Manager and your website, you will see the above messages appear. Switch to the GTM preview mode window and close the 'Connected' message.

The list of events on your left-hand side is shown in chronological order, with '1 Consent initialization' executed first and '5 Window Loaded' last. In the previous step, we have chosen 'Initialization - All Pages' as the trigger for our Google tag. This means that our Google tag should fire everytime an 'Initialization' event occurs (which is everytime a visitor loads a page). It also means that our Google tag should be found in the initialization phase. Click on '2 Initialization' to see that our Google tag has fired. If you click on other events, the Google tags will be found under the heading 'tags not fired'.

When checking if a tag has fired, you should always check whether or not the data has arrived at its final destination. The fact that the GTM preview mode shows that a tag has fired does not necessarily mean that the data has also been received at its destination. In our case, the destination is Google Analytics 4, and more specifically: GA4's DebugView. (The tag is not yet live, so nothing will be visible in your normal GA4 environment.)

To check if our data has been received by the GA4 DebugView, navigate to the GA4 website and log in with your Google account. Navigate to the admin section by clicking the cogwheel in the bottom left corner.

Click 'DebugView' in either in the property settings menu to the left, or in the data display section

The DebugView will show you in real-time what data has been received by your GA4 property as long as you have preview mode enabled in Google Tag Manager. Seeing as we have just sent preview mode data to our GA4 property via Google Tag Manager, there should be something to see here. However, this may take a while, especially with new GA4 properties.

Although the GA4 DebugView share some characteristics with the GTM preview mode, they really are two different and separate modes. While DebugView shows all the incoming data, the GTM preview mode is not tied to Google Analytics 4 or any other Google products. For example, may also use it to check if your Meta/Facebook pixel or your LinkedIn Insight Tag has been activated.

Ultimately, a page_view event should become visible because Google Tag Manager has just sent it to your GA4 property via the GTM preview mode. Once this is visible, click on the page_view event. (On the blue icon.)

Here you will see which parameters have been sent to Google Analytics 4 along with the page view. Parameters are extra pieces of information which are sent along with an event. For example, if someone views a product on your website, in addition to the event, extra information can also be sent to GA4 through the use of parameters. This includes information about the name of the product, category, price, etc. In our case, page_location has been sent as a parameter. If you click on it, you will see the URL of your website plus some extra characters. If you compare this URL with the URL in the window/tab containing your website (opened by the GTM preview mode) you will see they are identical. This means that the connection between your website and Google Analytics 4 is working properly.

Now that we have verified that our Google tag works in both GTM and GA4, we are ready to publish the GTM container containing the Google tag. This will let the tag go live for your website visitors, so that we can collect the data of their visit(s) to your website and forward it to your Google Analytics 4 property.

Het publiceren van de container doen we door in het Google Tag Manager overzichtsscherm rechtsboven op de blauwe 'Verzenden' knop te drukken.

Enter an appropriate version name here. In this case, a name like 'Google tag' would suffice. Although it is advisable to add a version description every time you publish a new container, in this case you can leave the version description blank. When you're done, click the 'publish' button. This will publish the changes, which will immediately go live for your website visitors. You will then see a version overview, which you may close.

You will then be presented with an overview of all versions of your container. As you can see in the image above, the version we have just published under the name 'Google tag' is colored green, which means that this is the version that is currently live. (Only one version can be live at the same time.) Also, under 'status' you will see that this version is currently live.

You will most likely run into the situation that you need to go back to an older version of the container, which is called a 'rollback'. Restoring a previous version of your GTM container can be done via this version overview. All you have to do is click on the three vertical dots to the right of the version you would like to have live.

In het menu wat vervolgens verschijnt drukt u op 'Publiceren', en in het volgende scherm nogmaals op 'Publiceren'. Hierna zult u zien dat de betreffende versie groen gekleurd zal zijn in het overzicht en de status 'Live' zal hebben.

To navigate to this versions overview screen from another screen, click the 'versions' tab in the upper left corner.

After publishing the container containing our Google tag, your visitor data should become visible in your Google Analytics 4 property. If you still cannot see your website traffic in GA4 after 24 hours, there is a good chance that your tag is not set up correctly. If that's the case, please go through the steps in this guide again.

If your website and domain are relatively new, there will of course be little data visible in your GA4 property. However, if you have not yet filtered out your own IP address in GA4, it should be possible to view your own visit to your website in GA4. You do this by first logging in to your GA4 account.

Click the second icon from the top in the upper left corner. Then click on 'realtime' to open the realtime reports. This is where all website traffic of the last 30 minutes should be visible live (with a slight delay). Then open a new window/tab and navigate to your own websi

If you have completed all the steps in this manual correctly, your visit to your own website will be visible in the real-time reports of Google Analytics 4. Here you will see in various places that your website has received a visitor. If nothing is visible, wait a while. (It may take a while before your visit becomes visible in GA4.) If still nothing has been registered, try visiting your website in an incognito window and/or disabling your ad blocker (browser extensions as well as standalone ad blockers, such as AdGuard). Your visit should become visible.

This brings us to the end of part 3 of our Google Tag Manager for beginners guide.