Set up Google Tag Manager for Analytics (GA4)

This topic will show you how to use Google GA4 Analytics through Google Tag Manager. After you’re done, the Google Tag Manager API will be running on your Discourse site, so you could in theory send arbitrary events to any service that integrates with Tag Manager. Analytics is only the beginning.

:warning: For security reasons, all up-to-date Discourse installs enable a Content Security Policy which blocks all non-Discourse scripts. This means that if you add external scripts through your GTM integration, you might have to allowlist their domains in order for the scripts to run successfully.

For example, if you have enabled Advertising features or AdWords integration, you would need to add

  • https://stats.g.doubleclick.net
  • https://www.google.com

to the content security policy script src site setting.

If you have your own custom scripts in Custom HTML tags, you can follow this guide to allow them to run in Discourse.


GA4 Analytics

The first thing you’ll need is to create an Analytics account. If you’re signed in with a Google account, then simply visiting https://analytics.google.com will guide you through creating an account.

:warning: Per Google, on July 1, 2023, they will stop processing data for Universal Analytics properties. Starting in March 2023, for continued website measurement, migrate your original property settings to a Google Analytics 4 (GA4) property, or they’ll be copied for you to an existing GA4 property, reusing existing site tags.

Once in your account, create a property:

From here you’ll work your way through 4 screens. The first is Property creation:

Then Business details:

Then Business objectives.

:information_source: Selecting the four sections will most closely match the reports Analytics has typically provided:

And finally, Data collection. Here you’ll select Web as the platform:

Now set up a data stream by entering your site url and a stream name:

:information_source: After successfully creating your web stream, you’ll get a Web Stream Details page. Make note of your Management ID on this page. You’ll need this later when setting up your GTM Tag.

We’re done with the property setup in Analytics!

Tag Manager

Visit https://tagmanager.google.com and let Google set you up. Once you’re in, you’ll be prompted to create your first “Account” and “Container”. When asked where the container will be used, choose “Web”.

Now that your container has been created, we need to create the events we’ll send through the Tag Manager API to Google Analytics.

Variables

Go to the Variables tab on the left. Click the “New” button in the User-Defined Variables section at the bottom. You’ll need to create two data layer variables:

Title: DL - page title
Type: Data Layer Variable
Data Layer Variable Name: page.title
Data Layer Version: 2

Title: DL - page url
Type: Data Layer Variable
Data Layer Variable Name: page.url
Data Layer Version: 2

As an example, choose the variable type:

Then configure the variable:

Triggers

Now let’s create a trigger that does something when those variables arrive from the API. Click the “Triggers” tab on the left and click New. Choose “Page View” as the type, click save, and name the trigger virtualPageView.

image

Your trigger should look like this once it’s been saved.

Tags

Finally…we’re ready to connect GTM to Analytics. Click the Tags tab on the left and create a New tag. Then Choose Tag Type Google Analytics: GA4 Configuration

  • Configure Tag:
    • Measurement ID: enter your Measurement ID from your Analytics Web Stream
    • Fields to Set:
      • name: cookieDomain, value: auto
      • name: title, value: {{DL - page title}} (can be chosen from a dropdown)
      • name: page, value: {{DL - page url}} (can be chosen from a dropdown)

When finished it should look like this:

We’re almost done!

Publish

None of your work is live until you click the Publish button on the top right of the page. It will be red if there are changes that haven’t been published.

:warning: If your Discourse site is reporting 404 errors from googletagmanager.com, it’s probably because you didn’t publish your changes.

Discourse

GTM is waiting for data, so let’s add it to our Discourse site. Go to the Settings tab of admin and search for gtm container id and enter your Tag Manager id (GTM-XXXXXXXX). It should always be displayed on the top navigation bar of the Tag Manager UI.

:warning: Be sure to remove your Analytics tracking code from the ga universal tracking code and ga tracking code settings.

Reload the page and data should be flowing through GTM to Analytics. Watch the real-time content view to see traffic and url’s of your site visitors.

More?

Now that you have pageview data going into tag manager, you could add more Tags that receive the events. Google DFP, AdWords, LinkedIn, and others are in the list.

Related Links:


Last Updated by @MarkDoerr on 2023-04-17T23:24:34Z

45 Likes

Hi
since the last update, GTM removed the “GA4 Configuration” tag, and introduced one named “Google tag”. It doesn’t seem to be exactly the same.

Could you update this tuto / explain how to setup GA using discourse using this new method ?

thanks

2 Likes

Even I am facing similar issue with setup