404 Error Tracking Event with Google Analytics and Google Tag Manager
A general outline can be found in this video https://www.youtube.com/watch?v=kKIyvycJbzs. It is recommended to see it first, to get an idea of what we are trying to accomplish. However this is 4 years old and the interface of the Google Tag Manager has changed. There are also differences relevant to SprocketRocket, such as the fact that we can not base our trigger on the value of the page title. The title
tag is empty in the 404 page, as the variable we use by default - {{ page_meta.html_title }}
- has no value inside the system pages. There are also situations where chat scripts like the Intercom Chat Assistant loaded on Qualio.com rewrite the title
tag.
Instead we can take advantage of our ability to edit the template of the system pages. We can add an ID attribute to the HTML tag with the following value: id="404Page"
. We can later use this attribute to trigger our event.
Here are the steps to setup this tracking event:
01. Turn on Preview
mode inside Google Tag Manager
Preview
mode inside Google Tag Manager02. Trigger a 404 page error on the target site.
If the Google Tag Manager console does not appear, do a hard refresh of the browser.
03. Define a new Custom Javascript
variable with the name 404 Body ID
.
Custom Javascript
variable with the name 404 Body ID
. Use the code below for the value:
function () {
if(document.getElementById('404Page') === null) {
return false;
} else {
return true;
}
}
04. Create a new Trigger
Set the name to
404Error
.Choose the trigger type as
Page View
.Fire the trigger when
404 Body ID
equalstrue
05. Set up a new Google Analytics Tag
Use the following settings:
Name:
Google Analytics - Event - 404 Error
Tag Type:
Google Analytics - Universal Analytics
Track Type:
event
Category:
404 Error
Action:
{{ Page Path }}
Label:
{{ Referrer }}
Non-Interaction Hit:
true
Trigger:
404Error
06. Test the trigger and the tag
Go to Google Analytics > Real-Time > Events
and choose Events (Last 30 min)
in the view options. Trigger the 404 page again and check if the event appears in the list.
07. Save changes
Once the tracking is functional, return to the Tag Manager and submit the workspace changes. This will bring the update live.
08. View Analytics
To track the errors in the long term, go to Google Analytics > Behavior > Events > Overview
. Adjust the date range accordingly at the top of the page. In the Events Category
click on the 404 Error
category to see the results.
References
Last updated