The 121 Second Guide to Create & Deploy Click Events in Google Tag Manager
By Mike Krass on December 14, 2015
It’s taken a few years, but with Google Tag Managers v2 release we’ve begun to see more documentation about how to properly deploy tag, create triggers and variables and generally make use of Google Tag Manager (GTM).
This guide will teach you how to deploy a Click Event in GTM that reports into your Google Analytics.
Common use cases for this implementation include:
- Tracking key button clicks on a website
- Tracking where users tap on their screen on mobile devices
Step 1: Create a Click Event Trigger in Google Tag Manager
TL;DR Click the image below to watch a 72 second video below to learn how to create a click event trigger.
[video width=”2542” height=”1280” mp4=”/img/blog-posts/2015/12/google-tag-manager-mkg-marketing-inc-create-click-class-trigger.mp4”][/video]
For the purpose of this tutorial, let's assume that you want to create a Google Analytics event that fires every single time somebody clicks on the big orange 'Contact' button on our website.
Your first step in this process is to find the Click Class. Follow these three steps:
- Open up the Chrome browser
- Right click on the element you want to track - in this case our orange Contact button - and click 'Inspect Element'
- Chrome DevTools will pop up and you'll see a named Class. Copy that name.
Now that you’ve got your Click Class handy, you’ll want to navigate back to Google Tag Manager.
- Select 'Triggers'
- 'New' (big red button)
- Name your trigger "GA - Contact Button Clicks"
- Select 'Click' as your event type in step 1
- Targets dropdown should be set to 'Just Links'
- Leave the 'Wait for Tags' and 'Check Validation' alone and click 'Continue'
- In Step 3, Enable when should be set to 'Click Classes' contains [insert Click Class here from your Inspect Element step above]
- Finally in step 4, fire on URL matches RegEx (regular expression) .* to fire on all pages of your website.
Step 2: Create a Tag in Google Tag Manager
Think of your Trigger as the first domino - it is the catalyst that sparks change down the line. It tells your Tag that it needs to fire when certain conditions are met.
So now it's time to make that Tag!
TL;DR Watch the 49 second by clicking on the photo below to learn to make an Event Tracking tag in Google Analytics.
[video width=”1996” height=”1244” mp4=”/img/blog-posts/2015/12/google-tag-manager-mkg-marketing-inc-create-click-event-tag.mp4”][/video]
- Navigate to Tags option on the lefthand side
- Click 'New'
- Select 'Google Analytics'
- Choose 'Universal Analytics'
- Input your Tracking ID - I have mine saved as a variable so ignore the text you see in the screengrab
- Configure tag type in the Track Type dropdown. Select 'Event'
- Category, Action and Label are for your own convenience. Name them something that will remind you what is being reported in Google Analytics.
- Finally at Step 4, 'Fire On', scroll over to the 'More' option and select the Trigger we created earlier
- Finish up by clicking the blue 'Create Tag' button
Step 3: Debugging and Quality Assurance (QA)
Use the preview mode provided by GTM to see the tags fire. Secondary debugging tool is the Chrome DevTools extension (Command + Option + I on a Mac).
Voila! There you have it :)