Google Tag Manger Tracking Cheatsheet

Create Google Tag

Google tag is a required tag to send events from gtm to ga4 The Google tag establishes the data flow from your website to Google Analytics and other destinations you might have set. Create one Google tag per domain and place it on every site that you want to measure.

If you don’t have this tag then events like click tel and mailto will not fire to ga4

The google tag is a connector between GTM and GA4

Create the Google Tag

In GTM,

• Go to tag add new
• Give it a name.. A nice convention for adding this tag is Google tag configuration - example.com
• Add the tag, from the “sliding draw” hit google tag.

Adding the Measurement ID

Measurement ID can be found in GA.

• In google analytics
• Hit the admin button in the bottom left
• Open data collection and modifications
• Click data streams
• Click the web tab
• Click your data stream (which probably is labeled the same as your website address)
• Find and copy measurement id
• Add event name gtm_ga4_data, this is up to you.

View google instructions

Paste the Measurement ID

Paste the Measurement ID from GA into the Tag id field in GTM.

This is what you should have.

Add Trigger

• Add Trigger
• choose Initialization - All Pages

Click Save.

form submissions

Prerequistes

• Google Analytics installed on your gtm
• Google tag added to your GTM

Get your Success Message

We are going to use your form success message as the element visibility trigger. As soon as the browser renders the form success message (which is hidden by default and only visible after the form is submitted) that is when we track it as a conversion.

• You can target the success message by id or css selector so you want to check the html wrapper of the success msg and copy that.

In my case my success message html is:

<div
  class="some-form-class"
  id="gform_confirmation_message_1"
>
  <p>Thanks for contacting us! We will be in touch with you shortly.</p>
</div>

I’m going to use the id from the above wpforms-confirmation-1109. When that id is visible on the page, then the Trigger will fire.

Add Trigger

• Select the element visibility tag
• Choose id or css selector from drop down method selector.

Add Element ID

• Ensure to use the . for the .css_selector, when targeting ids just the text is required.
• Paste in the id or css value of the success message html wrapper
• Select Once per page
• Select minimum percent visible to be 1
• As the message will be a “new” appearence on the screen select observe dom changes

Use id for best practice

using css class can have performance hit.

Confine test to Specific page

Set trigger to fire on some visibility events.

Page URL equals https://example.com/your-page.

Preview Changes

• Enter URL where form is, test the form submission and see if the element visibility event was Triggered.

Attach the trigger to tag

Create a Tag

• Add New Tag
• Call it same name as the trigger

Add the following to create your tag

• Google analytics
• GA4
• Add measurement id
• Add event name of generate_lead

When then event is sent google tag manager also sends the page url which is important for working out which page form was submitted on you can see these pages in pages and screens and then filter by key event Please Note: the form submission event must be marked as a key event in Google Analytics (GA).

Select Trigger

• Select your visibility Trigger you created earlier
• Save

Can I have Multiple Triggers?

If you have multiple forms you can have multiple triggers using a unique id for each form. Just keep adding more triggers. In Google analytics you can see which form was submitted.

Preview Test

• Hit Preview
• Fillout your form
• In tag manager debugger window
• Hit element visibility event in sidebar
• Check your form submission tag was fired.

Submit your changes.

If everything worked in the preview submit your changes.

More Info

more info

Phone clicks

Add a Google Tag

This only needs to be done once in your gtm and you can reuse it for all events The Google tag establishes the data flow from your website to Google Analytics and other destinations

Creating a google tag

Add Click Variables

This only needs to be done once in your gtm and you can reuse it for all click events

Go to Variables

• Click configure in top right
• Scroll down to clicks

To ensure we have the required Variables enabled in GTM we need to add the ones we need for the click tel.

• For tracking phone clicks, we just need to add the Click URL from the “click” section of variables.
• Scroll down and enable the Click URL by checking the check box.
• Then click Add

Add Triggers

• Call it phone_click
• Click - just links.
• Some link clicks.
• CLICK URL contains tel:
• Save

Create a Phone click Tag

• Go to Tags
• Click New tag
• Call it phone_click
• Tag configuration
• Choose Google Analytics
• Choose Google Analytics: GA4 Event
• Add GA4 Measurement ID
• event name generate_lead

Your tag should be able to locate the google tag you created earlier. If your tag cannot find the google tag. then your missing your google tag and you still need to add it. Creating a google tag

Get Measurement ID

Now you need to go to Google Analytics instead of tag manager. Frustrating? Absolutely! So open a new tab and start loading up the Google Analytics account for the client your working for.

• In Admin, under Data collection and modification, click Data streams.
• Select the Web tab.
• Click the web data stream.
• Find the Measurement ID in the first row of the stream details.

Now you need to back to tag manager and add in the measurement id.

Add Event Name

• phone_click

Add Trigger To Tag

• Choose your phone trigger you created earlier
• Hit save

Preview

• hit preview
• add url

View the data sent from GTM in GA4

• Login to Google Analytics
• Click Engagement
• Click Events
• if users have interacted with your site by clicking the click tel then you will see that event in GA4

more resources

more info

Where to find the Google Tag Manger Integration code

Prerequisites

You have a google tag manager account

Go to tag manager

Locate your ‘container’

The thing you want to locate is refered to as a ‘container’ which is a bit confusing. Anyhow this is what your looking for.

tagmanager container

Get the code

• Hit the cog wheel
• Then hit the install tag manager option.

install tag manager code

Copy the code

Now you have the code appear. Ready to be copied to your website.

Cant find your container?

Ensure your logged in as the correct google user

ie: account 1 account 2

GTM Access

Dont know who the owner of a Google Tag Manger (GTM) account is?

** Audit User Permissions: ** Check the users listed on the Google Analytics (GA) account. The creator of the Google Tag Manger (GTM) is probably also listed as an admin on the Google Analytics (GA) account.