Google TAG Manager

About this document

Anytime you see text in the code style, it is referred to literally, unless encased in {}. In that case, you would substitute the {} and everything inside with what it refers to. Some examples:

  • Name -> "Name"
  • {Name} -> "Reece"
  • Hello {Name} -> "Hello Reece"

Requirements

In order to create/configure Server Side Tagging, the GA4 must be created/configured. Check GA4 Setup for more details.

As there will be changes made to the DNS, make sure we have access.

Google Tag Manager Account

Creation

  1. Go to GTM Dashboard and create a new account.
  2. Set the correct options:
    • Account Name: {Company Name}
    • Country: United States
    • Container Name: {Company Name} - Web
    • Target Platform: Web
  3. Create and account and accept the Terms of Service agreement.
  4. Ignore Snippet Installation for now.

Web Container

Save the Container ID in the top right, following the pattern "GTM-____" for later usage.

GA4 Configuration

  1. Go to "Tags" page from the "Workspace" page, and create a new tag
  2. Choose "Google Analytics: GA4 Configuration" type as the "Tag Configuration"
  3. Configure the tag
    • Measurement ID: {GA4 Measurement ID} (looks like "G-____")
      • This can be found by going to the GA4 Dashboard for the given Property, then going "Admin" > "Data Streams" > the Data Stream this should use > "Measurement ID"
    • Send a page view event when this configuration loads: checked
    • Send to server container: checked
    • Server Container URL: https://metrics.{website url}
    • Include user-provided data from your website (Server only): checked
    • Selected user-provided data variable:
      1. Select "New Variable..."
      2. Type: "Automatic Collection"
      3. Check the "Exclude selected elements" box and add the CSS selector [href^="mailto:"]
      4. Name it GA4 Auto Collection and save it
  4. Configure the Trigger to be "All Pages" trigger for the "Page View" type
  5. Set the name to something descriptive, such as GA4 Configuration and save the tag

Publishing

  1. Submit the changes made to the container.
  2. Leave "Publish and Create Version" set.
  3. Name the version and possibly the description of the changes, and publish.

Server Container

Creation

  1. Create a new container by either:
    • Starting from the Web Container Screen (where the last section left off), go to "Admin" and click the plus under the "Container" side
    • Starting from the Accounts Screen, find the account in question and click the three dots for more options and choose "Create Container"
  2. Name the Container {Company Name} - Server
  3. Choose "Server" for the Target Platform and create it.
  4. Choose "Manually provision tagging server" for setting up the tagging server, and save the container config for later usage.

Container Configuration

  1. Go to "Container Settings" under the "Admin" screen.
  2. Add https://metrics.{website url} to the Server URLs and save.

Web Client Configuration

  1. Go to the "Clients" page from the "Workspace" and create a new client.
  2. Choose "Google Tag Manager: Web Container" for the client type.
  3. Add the Web Container ID that was saved earlier (looks like "GTM-____")
  4. Leave "Automatically serve all depdendent Google Scripts" and "Compress HTTP response" set.
  5. Name the client something descriptive, such as GTM Web Container, and save the client.

GA4 Client Configuration

  1. Go to the "Clients" page from the "Workspace" and select the pregenerated GA4 client
  2. Configure client
    • Priority: 0
    • Default GA4 paths: checked
    • Default gtag.js paths for specific IDs: checked
    • Measurement ID: {GA4 Measurement ID} (looks like "G-____")
    • Automatically serve all dependent Google scripts: checked
    • Compress HTTP response: checked
    • Open "More Settings"
    • Name: FPID
    • Domain: auto
    • Path: /
    • Cookies and Client Identification: "Server Managed"
    • SameSite: "Lax"
    • Cookie Expiration in Seconds: 63072000
  3. Name it GA4 and save it

GA4 Trigger Configuration

  1. Go to the "Triggers" page from the "Workspace" and create a new Trigger
  2. Set the type to "Custom" and configure
    • This trigger fires on: "Some Events"
    • Condition (from left to right):
      1. "Choose Built-in Variable..." -> "Client Name"
      2. "equals"
      3. GA4 (to match the client)
  3. Name it All GA4 Events and save it

GA4 Tag Configuration

  1. Go to the "Tags" page from the "Workspace" and create a new Tag
  2. Set "Tag Configuration" type to "Google Analytics: GA4"
    • Leave all settings as default
  3. Set Trigger to the "All GA4 Events" trigger
  4. Name it GA4 and save it

Coversion Linker Tag

  1. Go to the "Tags" page from the "Workspace" and create a new Tag
  2. Set "Tag Configuration" type to "Conversion Linker"
    • Leave all settings as default
  3. Set Trigger to the "All GA4 Events" trigger
  4. Name it Conversion Linker and save it

Publishing

  1. Submit the changes made to the container.
  2. Leave "Publish and Create Version" set.
  3. Name the version and possibly the description of the changes, and publish.

Cloud Run

Create Preview Server

  1. Go to the Cloud Run Dashboard and create a new service.
  2. Configure the service and create it
    • "Deploy one revision from an existing container image"
    • Container image URL: gcr.io/cloud-tagging-10302018/gtm-cloud-image:stable
    • Service name: {company-name}-preview-service
    • Region: us-east1
    • CPU allocation and pricing: "CPU is only allocated during requestion processing"
    • Minimum number of Instances: 0
    • Maximum number of Instances: 1 Do not set higher than 1 for the preview server
    • "Allow direct access to the service from the internet"
    • Authentication: "Allow unauthenticated invocations"
    • Open the "Container, Networking, Security" options if not already open.
    • Request timeout: 60
    • Add 2 Environmental Variables:
      • RUN_AS_PREVIEW_SERVER: true
      • CONTAINER_CONFIG: the saved container config from earlier
  3. Once the service is running, save the generated URL for later (ends in .run.app)

Create Tagging Server

  1. Create the service same as above, with these changes:
    • Service name: {company-name}-service
    • Maximum number of Instances: 100
    • Remove RUN_AS_PREVIEW_SERVER
    • Add new enviroment variable: PREVIEW_SERVER_URL which is the URL of the preview service

Mapping Custom Domains

  1. Go to the Cloud Run Dashboard and then go to "Manage Custom Domains".
  2. Configure and continue
    • Select a service: Choose the non-preview service
    • Select a verified domain: Select the domain for the website
    • Specify subdomain: metrics
  3. Update the DNS records as shown. More Info on DNS

Install to Netlify

  1. In the Web Container for the account, go to "Admin Settings" > "Install Google Tag Manager". Keep the scripts handy.
  2. Go to the site under Netlify, then "Site Settings" > "Build & Deploy" > "Post Processing" > "Snippet Injection"
  3. Add the JS to the head, and Noscript to the body, but change www.googletagmanager.com to metrics.yourwebsite.com