Set up Google Tag Manager with GA4

  • Updated

Google Tag Manager implementation requires a testing process. We recommend that you implement Tag Manager on your Sandbox site first and verify accurate tracking of user events before recreating the tracking on your Production site. The following steps will need to be completed twice: once for Sandbox and once for Production.

Adding Google Tag Manager to your Google Analytics 4 Web Property requires the following three steps:

  1. Create or sign in to your Tag Manager account and container
  2. Import Optimizely’s default json file into your container
  3. Install Google Tag Manager on your Optimizely website via the Configured Commerce Admin Console

Create a Tag Manager account and container

  1. Access Google Tag Manager.
  2. Click Create Account to create a new Tag Manager account.
  3. Enter an Account Name, country, and Container Name for your Tag Manager account. Select Web as the Target platform.
    • An example Account Name would be the name of your website
    • An example Container Name would be “Optimizely Default Spire GA4 Container”
  4. Click Create. Read and accept the Google Tag Manager Terms of Service Agreement. A modal with Install Google Tag Manager instructions will appear. This information will be needed later.
  5. Copy and paste these snippets for easy access, then close the modal.

Import default tags to your Tag Manager Container

  1. Go to the Tag Manager home page, and click Admin.
  2. Go to Container > Import Container. Import the Spire-ga4-container.json file provided in this article.
  3. Select Existing workspace, and then click on the Default Workspace.
  4. Select Merge and Rename conflicting tags, triggers, and variables,  and click Confirm.
  5. Click Tags. This page provides a list of the tags included in the Container. The tags included in the json file have been given unique names starting with GA4 to make it easy to differentiate the old tags from GA4 tags.
  6. Click on the GA4 - Pageview tag. Under Measurement ID, ensure that the number shown is the Measurement ID for your Google Analytics account. If not, click the Edit icon, and update the Measurement ID to match your Google Analytics Account. Click Save
  7. Click Submit at the top right. 
  8. Put today's date under Version Name so you can track when these changes were published. Click Publish.

Install Google Tag Manager on your Configured Commerce site, which includes your GA4 property

To start tracking by Google Analytics and Tag Manager, you must install the Google Tag Manager snippet on your Configured Commerce site via the Configured Commerce Admin Console. The Google Tag Manager snippet is linked to Google Analytics and will provide tracking for both GA4 and GTM.

  1. Find the Google Tag Manager snippet:
    • Sign in to Tag Manager.
    • Select the Account and Container that relates to your GA4 set-up on All accounts.
    • Select the Admin tab, then click Install Google Tag Manager. Copy and paste tag manager ID (i.e. GTM-####).
  2. Install the Google Tag Manager snippet in the Admin Console of Configured Commerce. You can review the documentation on installing Google Tag Manager if you need help.

You have completed a basic setup for Tag Manager. Once you have verified Tag Manager data in Sandbox, you will need to repeat the above steps for Production. The setup for production will be identical to Sandbox but will have separate containers and properties.

You can learn more about Google’s Tag Manager in Google Analytics Academy's Google Tag Manager Fundamentals

Appendix: Default tags included in Optimizely’s template tag container

This article details a basic setup of Tag Manager and includes a template container with a set of tags that will help you get your Tag Manager site up and running. This section walks through the details of the tags included in that container and refers to the json file entitled Spire-ga4-container.json (the json file for Classic CMS is coming soon).

The Tags provided in the template container are designed to work for the B2B Analytics product. Changes to the CSS may affect the behavior of these tags and should be tested and/or reviewed by your implementation partner or someone knowledgeable about Google Analytics 4 (GA4) before being pushed to production.

Below is the list of self-service tags that are in the template provided by Optimizely and are organized by group for easier identification.

  • Tags related to PageView Navigation  – These tags are maintained in the variables setup called Digital Self Service Pageview Lookup and under the name GA4 – Event – Self-Service.
    • myaccount  
    • catalog  
    • contactus  
    • orders  
    • requestaccount  
    • dealerlocator  
  • Tags related to Lists 
    • create list (named: GA4 – Event – createList)
    • add to list (named: GA4 – Event – addToList)
    • share list (named: GA4 – Event – shareList)
  • Tags related to Orders 
    • quickorder (named: GA4 – Event – QuickOrder)
    • reorder button (named: GA4 – Event – reorderButton)
    • upload order (named: GA4 – Event – UploadOrder)
  • Tags related to Search 
    • search Event (named: GA4 – Event – Search Results)
    • search Autocomplete Event (named: GA4 – Event – Search Autocomplete Results)
  • Tags related to Downloading Content  
    • download content (pdf, jpg, xlsx, doc) (named: GA4 – Event – File Download)

Json files