Using Google Analytics event tracking

Google Analytics Event tracking is an invaluable feature that allows you to record interactions with elements of your website which aren’t tracked by default within Google Analytics.
Simply by adding snippets of code to your site, it is possible to track event interactions to understand how long users spend watching your videos or even which fields on your forms users drop off at.
In this post, I explain how to track events manually by editing the code on your site or by using Google Tag Manager if you are less confident with editing code.

What can Google Analytics event tracking be used for?

Before we go into detail about how to set everything up. Let’s look at some of the different ways that Event tracking can be used to measure visitor engagement on your site. Some of the typical uses for event tracking are listed below:

• Tracking outbound link clicks to other websites.
• Understanding how many users clicked on mailto email addresses or click-to-call phone numbers. This can help you to better understand the number of enquiries you are getting from your site.
• Tracking PDF and other media downloads.
• Measuring interactions with video content, such as time spent watching a video.
• Tracking exactly where users drop off when filling in fields on your forms or checkout
• Monitoring the clicks on unique elements of a page, such as the “contact us” call to action on your about page.
• Collecting data about how many users filled in and submitted a form, although I would always recommend sending users to thank you pages whenever possible.

Event tracking allows you to count interactions that don’t necessarily involve loading another page on your website. Google Analytics goals can also be set up based on your events.

What to consider before you start

To use event tracking you will need to have Google Analytics installed on your website. This can be achieved by adding the code to all of the pages on your site or by adding Google Tag Manager code to your site and then configuring Google Analytics tags and triggers and variables.
Before you jump into setting up event tracking, it is important to consider the following points:

• There are two versions of Google Analytics tracking code. Check whether you are user the older Universal Google Analytics (Analytics.js) code or the newer Google Analytics gtag code (gtag.js) before applying any code referenced in this post. I recommend migrating to the newer version of Google Analytics and Google has written a guide on how to migrate to using gtag.js. as this designed to combat intelligent tracking prevention (ITP) that blocks cookie data in browsers.
• Decide on which elements of your site you want to track, whether it is PDF downloads or clicks on outbound links.
• Adopt a consistent and clear naming convention for the different action, label and category options available to you when you are setting up event tracking. Every name you give to each category, actions, and labels appears in the event tracking reports. If your naming isn’t sensible then your report won’t make a lot of sense later on.
• Decide whether you want to set up auto-event tagging or manually tag links on your site. If you have a lot of documents and page elements to track it may be worth setting up Auto Event Tagging and using Google Tag Manager Events.

How does Google Analytics event tracking work?

A snippet of custom code is added to the link code on the items you want to track on your website and when the item is clicked, the element is tracked and displayed as an event in Google Analytics.
The event tracking code consists of four elements that you can define to describe a user’s interaction on your website:

• Category (Required) is the name you give to a group of objects you want to track.
• Action (Required) is the type of interaction, such as downloading a document.
• Label (Optional) is useful for summarising what the event is about, such as clicks on navigation menu options.
• Value (Optional) can be used if you’d like to assign a numeric value to your file download.

When the event fires on your site, the ‘Category’, ‘Action’, ‘Label’ and ‘Value’ attributes can be used to help you understand exactly what the user engaged with on your page. As mentioned above, it is important to give some thought to the naming conventions used for these attributes as these values are what will show within Google Analytics.
The event tracking code for an event tracked link in Universal Analytics looks like this:
onclick=”ga(‘send’, ‘event’, ‘Category’, ‘Action’, ‘Label’, ‘Value’);”
The code is placed after the href link text as illustrated in the example below:
<a href=”www.examplewebsite.co.uk/company_brochure.pdf” onclick=”ga(‘send’, ‘event’, ‘Category’, ‘Action’, ‘Label’, ‘Value’);”>
The category, action, label and value labels are replaced by the values that you decide to enter. An example of an event tracked link with entered values is further down the page.

How to set up Google Analytics event Tracking

Depending on the number of events you would like to track, or the level of control you would like to have on the tracking parameters for your events, you can setup up auto event tracking, or manually tag links on your website.
If you have lots of documents and page elements to track it is worth using auto event tagging. This can be done using Google Tag Manager. Auto event tagging will fire on the following:

• When users click on links.
• Clicks on any type of page element.
• After a certain visit duration or at timed intervals.
• On submission of a form.

If there are other actions that you would like to track you can use Google Tag manager to set this up.

Manually tagging links to track events

You can manually customise links on your site to add the ‘Category’, ‘Action’, ‘Label’, ‘Value’ attributes to a link as already discussed earlier. To give you a practical example of this, the example below shows a link that includes event code for tracking a PDF download.
The italicised text below shows an example of event tracking parameters configured to record the download of a company brochure PDF document.
<a href=”www.examplewebsite.co.uk/pdf/company_brochure.pdf” onclick=”ga(‘send’, ‘event’, ‘PDF’, ‘Download’, ‘Company Brochure – PDF Download’);“>Download Our Brochure</a>

Auto-event tracking options

Event tracking using Google Tag Manager

 

You can measure interactions on your site by setting up Google Tag Manager’s Auto-Event Tracking.
This might sound complicated but once you understand the basic principles of tags, triggers and variables it becomes quite straight forward.
Event tracking using Google Tag Manager is initiated via clicks on event triggers that can be setup on specific variables on your webpage. Google Tag Manager Events are user actions with web page elements (“DOM elements”) that are triggered by your browser and sent into the Tag Manager data layer so that they can be used to set up triggers.
A summary of the steps required to setup an event within Google Tag Manager are listed below:

1. Log into Google Tag Manager
2. Select “Tags” from the left-hand side
3. Create a new tag and select Universal Analytics as the Tag Type
4. Set your Google Analytics Tracking ID
5. Choose “Event” for the track type
6. Set your Event Category, Action, Label and Values. You can use Google Tag Manager variable names such as {{click url}}
7. Set your triggers as required

An example of how to set up an event within Google Tag Manager is outlined below:

Step 1 – check you have the right enabled variables selected for your event

Head over to the Variables section in Google Tag Manager and make sure that you have ticked the variables that you would like to track on your site.

You have the option to set up your triggers based on click classes, click elements, click text and other variables.

Step 2 – create a new tag in Google Tag Manager

Create a new tag in Google Tag Manager and change the Track Type to ‘Event’. The configuration options will now include tracking parameter fields for Category, Action, Label and Value as shown in the screenshot below.
As we discussed earlier in this post, the Category, Action, Label and Value attributes form the basis of the event variables within Google Analytics. There are Google Tag Manager specific code variables that you can use to automatically populate fields with values. For example, the {{Click}} code will automatically pull in the web URL into the field it is entered into.

Step 3 – configure the tag

Enter values for Category, Action, Label and Value.
The label should really be named to give you as much information as possible on what was clicked. If you were planning to track clicks on the navigation buttons in your site header, you may want to record the click URL of the item that was clicked on.
The Value box for your event can be populated if you want to attribute a nominal value to types of enquiries on your site. You may want to give a contact form submission a higher value than an email newsletter signup for example.
The True/False field is used for a non-interaction event. If you want your event action not to create a new pageview and not to impact on the bounce-rate, then set this value to True.
Setting the tag for a tracked event is the same every time. The main difference in setting up different types of tags is will be in configuring what the tag fires on.

Step 4 – select what the event tag will fire on

The next step is to select or create a trigger for the tag to fire on. You will need to set the fire on conditions for your tag. I have included a few examples of the different types of triggers for different events on your site.

Trigger for measuring clicks on an email address link

An example of a completed trigger for an email address clicked link is below.

1. On the choose Trigger Type screen under the Click heading choose Just Links
2. Select the Some Link Clicks under this trigger fires on
3. Set the variable to Click URL within the first drop-down box
4. Specify that the URL ‘Contains’ in the second drop-down option
5. Enter mailto: within the third field

Trigger for measuring clicks on a phone number

1. On the choose Trigger Type screen under the Click heading choose Just Links
2. Select the Some Link Clicks under this trigger fires on
3. Set the variable to Click URL within the first drop-down box
4. Specify that the URL ‘Contains’ in the second drop-down option
5. Enter tel: within the third field

Trigger for measuring PDF downloads

1. On the choose Trigger Type screen under the Click heading choose Just Links
2. Select the Some Link Clicks under this trigger fires on
3. Set the variable to Click URL within the first drop-down box
4. Specify that the URL ‘Contains’ in the second drop-down option
5. Enter .pdf within the third field

Testing that your events work as planned.

It is a good idea to check that your events work as you intend. To view results immediately you can preview your Google Tag Manager events using the preview feature and carry out your event action to see whether the tag fires successfully.
Within Google Analytics you can also see events fired within the last 30 minutes by going to the Real-Time section and then Events section.
If you’re not in a rush or want to view historic data, go to the Behaviour > Events section of Google Analytics.

Setting Up Event-Based Goals

Goals can also be set up in Google Analytics based on your events. To do this login to your Google Analytics account and follow these instructions:

1. Go to the property where you want to set up the goal
2. Click on Admin and then go to Goals and click on Add New Goal
3. Give your goal a name and select the event goal radio button option
4. Fill in the fields with the attributes for your specific goal. Remember to select Equal to, Begins with or Regular Expression options based on your event attributes.
   • Category
   • Action
   • Label
   • Value
5. Save your Goal
6. Remember to complete a test goal so that you have data and then come back the next day to check your event goal works

Conclusion

Google Analytics Event Tracking is a valuable addition to measuring user interactions on your website. It can be used in combination with traditional Google Analytics goals to measure micro or macro conversions on your site. Using Google Tag Manager and Tag Manager events means it is now easier for you to set up and control the events you want to track or you can still change the code on your site manually to add events if you prefer.

Useful links

• Google’s Event Tracking Guide for Universal Google Analytics.js
• Online Universal Analytics event tracking code builder
• Outbound link event tracking