Tuesday, April 23, 2024
No menu items!
HomeData Analytics and VisualizationHow to Install Google Analytics 4 with Google Tag Manager

How to Install Google Analytics 4 with Google Tag Manager

In late 2020, Google renamed its App+Web properties to Google Analytics 4 and officially graduated from beta (at least, that’s what Google is saying). This means that from now on, the default property (when you create it) is GA4. It is a completely revamped platform (compared to the previous versions). New interface, new tag template in Google Tag Manager, new data model, etc.

In today’s blog post, let’s take a look at one of the basic (but fundamental) topics – how to install Google Analytics 4. And we’ll do that with Google Tag Manager (because my blog heavily focuses on it).

Here’s the process of how to install Google Analytics 4 with Google Tag Manager:

Create a new GA4 property
Create a data stream (in this blog post, I focused on the Web stream)
Copy the Measurement ID
Create a Google Analytics 4 Configuration tag
Paste the Measurement ID and set the tag to fire on All Pages
Preview/test the new tag
Publish the changes in Google Tag Manager

As you can see, everything is pretty straightforward. So let’s dive in.

 

A Video Tutorial on How to install Google Analytics 4

If you prefer video content, I have recorded a quick tutorial on my Youtube channel. But if you want to learn some additional details, read this blog post as well.

You’ll learn the most if you do both: watch the video and read the tutorial.

 

If you are currently using the older version of Google Analytics

What if you are already using Universal Analytics (the older version of GA) on your website? Should you ditch it completely and replace it with Google Analytics 4? Should you use them both?

To answer that, I have published another blog post (and a video tutorial) on this topic.

In a nutshell, if you are reading this blog post in late 2020 or 2021, chances are that Google Analytics 4 is not mature enough to be used as a standalone web tracking platform. Hence you should use both tools (UA and GA4) at the same time.

But if you are reading this blog post in late 2021 or even more in the future, it will probably be enough to completely switch to Google Analytics 4.

And now, let’s learn how to install Google Analytics 4 with Google Tag Manager.

 

Create a Google Analytics 4 Property & Data Stream

If you want to create a new Google Analytics 4 property (and you are not using the Upgrade to GA4 option), then go to the Admin section of your Google Analytics interface (by clicking the Admin at the bottom-left corner) and then (in the Property section) click Create Property.

Then enter the name of your property. It might be the name of your website, of your company, a brand, etc. Choose your company’s country, reporting timezone, and the main currency that your business operates in.

Then press Next, answer several questions, click Create and your new property will be ready. The next step to complete is to configure your first data stream. It is a data source from which events will be sent to your Google Analytics 4 property. You can have multiple data sources in a single property. For example, 3 web properties, 1 for Android app, and 1 for an iOS app.

In this blog post, I will focus on a Web stream. Select it.

Then enter the URL of your website (for example, https://www.mywebsite.com). Note, that the protocol (https) is already selected. After that, enter the name of your website.

When you create a web data stream in Google Analytics 4, you have an option to enable/disable Enhanced Measurement. It is designed to help marketers get as many events in the reports as possible without the need to cooperate with developers or configure them in Google Tag Manager.

By default, this feature is enabled and will automatically track the following events:

Page view (event name: page_view)
Scroll (event name: scroll)
Outbound link click (event name: click with the parameter outbound: true)
Site search (event name: view_search_results)
Video Engagement (events: video_start, video_progress, video_complete)
File Download (event name: file_download)

If you want, you can disable/enable events individually. You can do that by clicking the gear icon in the Enhanced Measurement section and then clicking toggle buttons.

When you’re ready, press the Create stream button.

 

Install Google Analytics 4 with Google Tag Manager

When you create a data stream (web), you will see a Measurement ID.

At the top-right corner, you will see the tracking ID of your new property. Copy it. We’ll need to use it in Google Tag Manager.

By the way, if you ever get lost in the GA4 interface and you need to revisit this page, go to Admin > Data Streams > choose your most recently created stream, and then you will return to the same window that I have displayed in the screenshot above.

Then go to your Google Tag Manager container (if you haven’t worked with it, here’s a tutorial on how to get started) > Tags > New and choose GA4 configuration.

In the Measurement ID field, enter the ID that you copied in the GA4 interface. Keep the Send a page view event when this configuration loads if you want to automatically track pageviews.

Usually, that’s ok keep it enabled but in some situations, e.g. on single-page applications, it is more recommended to disable the pageview checkbox and create just a standalone configuration tag. You can read more about that here.

In the Triggering section, select All Pages and then name the tag, e.g. GA4 – Pageview.

 

Check the DebugView in Google Analytics 4

Enable the preview mode to test your changes.

Once you enable the preview mode, you should see the new GA4 tag among tags that fired.

Once you configure your events, it’s time to test them. The primary feature built for debugging GA 4 data is the DebugView section. You can find it by going to Configure > DebugView on the left side of the GA4 interface. Click it.

Most likely, you will not see any data there (yet). That’s because that data in the DebugView is visible ONLY when the debug mode in GA4 is enabled. Do not mix this with the GTM Preview and Debug mode. They are two different beasts.

To enable the debug mode in GA4, you have several options (any of them will work):

Enable the GA debugger Chrome extension
Send a debug_mode parameter together with an event
Have enabled Google Tag Manager’s Preview mode on a page that you’re debugging

In the case of the first option, install the extension here, and then click its icon (so that you can see the ON ribbon). From this moment, you will start seeing your events coming into the DebugView.

The other option is to send a debug_mode parameter with every event that you wish to see in the DebugView.

In Google Tag Manager, you can do that by opening the GA4 Configuration tag and adding the following parameter:

If the debug_mode parameter is set to true, the event will be seen in DebugView. If you are using a hardcoded gtag.js, here are the instructions on how to include the debug_mode parameter.

But since we are working with Google Tag Manager, having the GTM Preview mode enabled automatically sets the debug_mode to true, thus the data will start appearing in the GA4 DebugView.

When you start seeing data in the DebugView, you can click on every individual event and then a list of parameters will be displayed.

Click on that parameter to see the value that was received by GA4. Now that is some granular debugging!

However, I have noticed some delays between the event actually happening on a website and then appearing in DebugView. Sometimes, I have to wait for several minutes until the data come in. That’s a bit unfortunate and hopefully, the team behind Google Analytics 4 will improve this in the future.

Sometimes, refreshing the DebugView’s page helps too.

Also, make sure that you have selected the correct Debug device in the top left corner.

If multiple visitors have enabled the debug view (e.g. they all have enabled the Chrome extension), you will see multiple devices there and it might require some time to find yourself. This especially applies to my blog, when many of my readers have enabled the GA Debugger Extension and I have to guess which device (out of the other 15) is mine

Anyway, once you start seeing data in DebugView, things will look like this.

 

Publish your changes in Google Tag Manager

Once you made sure that the data is coming in and it is displayed properly, you should submit your GA4 changes in the GTM container and publish it.

You can do that by clicking the SUBMIT button in the top right corner and then complete all the other steps that the user interface asks you to do.

After that, you should soon start seeing the new data coming in your real-time reports as well.

 

Google Analytics 4 Realtime reports

On the left sidebar of the Google Analytics 4 interface, go to Realtime. This is where you will see the data coming into your reports. Unlike in the previous version (Universal Analytics), the new report offers you capabilities to see the data on a much more granular level.

First, you will see a map and a bunch of cards with traffic sources, most popular events, the number of users in the last 30 minutes (by the way, Universal Analytics real-time report shows the number of users in the last 5 minutes).

You can also take a look at the snapshot of an individual user. You can do that by clicking the View user snapshot button in the top right corner.

Then, you will see a stream of all events of that particular user, you can click on them (just like in the DebugView) to see things on a more granular level. If you wish to look at another user/visitor, you can click the button here:

To exit the snapshot, simply press the Exit snapshot button in the top right corner.

 

What’s next? More events!

When you install Google Analytics 4 basic tracking (page_view and Enhanced Measurement), the next step is to think about other events that you might want to measure.

To help you with that, I have published an in-depth blog post on how to track events with Google Analytics 4 with Google Tag Manager that includes a video tutorial as well.

 

Frequently Asked Questions

Here are some additional questions that you might have and I wanted to address.

What if I already have Universal Analytics installed on my site? Please refer to my blog post on how to upgrade to Google Analytics 4. But a short version is that you can use both GA versions at the same time. In the long run, it will be recommended to keep only Google Analytics 4 (but that recommendation will be reasonable probably just in late 2021).

What if I already have Google Analytics 4 tracking code hardcoded in the website’s source code. I would highly recommend implementing GA4 (or any other JavaScript-based marketing/analytics tool) via Google Tag Manager because of its flexibility. Click here to learn more about GTM benefits. But a short version goes like this: your developers should remove the hardcoded tracking code from your website and you should implement Google Analytics 4 via Google Tag Manager. My Google Tag Manager Course for Beginners covers the process and tips on how to migrate hardcoded tools to Google Tag Manager.

If I already have Universal Analytics implemented in Google Tag Manager, should I create a new GTM container for Google Analytics 4? No, you don’t need to create a new GTM container just for Google Analytics 4. Use your existing Google Tag Manager container for the new GA version as well. Google Analytics 4 requires completely different GA tags but they can definitely co-exist with Universal Analytics tags in the same container.

 

Final words on how to install Google Analytics 4

And that’s how you install Google Analytics 4 with Google Tag Manager on your website. The reason why this blog post was longer (than it should have been) is DebugView and Realtime reports of GA4. I wanted to properly introduce them and it is necessary for you to understand how they work.

Speaking of the process, here’s a summary:

Create a new GA4 property
Create a data stream (in this blog post, I focused on the Web stream)
Copy the Measurement ID
Create a Google Analytics 4 Configuration tag
Paste the Measurement ID and set the tag to fire on All Pages
Preview/test the new tag
Publish your changes in Google Tag Manager

Got more questions? Feel free to ask in the comments below.

 

The post How to Install Google Analytics 4 with Google Tag Manager appeared first on Analytics Mania.

Read MoreAnalytics Mania

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments