Guide to Google Analytics and Google Tag Manager Debugging

Debugging Google Analytics and Google Tag Manager tracking is quite difficult and sometimes a nightmare, esp. if you do not know what to look at and what to fix.

It could take anywhere from few minutes to several days to troubleshoot a GA/GTM issue which off course depends upon one’s skill set and experience.

The objective of this guide, is to help you troubleshoot some of the most common GA/GTM tracking issues, accurately and fast.

This guide is divided into two sections:

  1. Google Analytics / Google Tag Manager Debugging Tools – what you need to install/use, in order to get started.
  2. Debugging Basics – what you need to understand, in order to debug.

Google Analytics & Google Tag Manager Debugging Tools

You need couple of debugging tools in your arsenal before you can wage war on Google Analytics issues.

Install/use following Google Analytics & Google Tag Manager debugging tools:

#1 Chrome Web Browser


Many of the debugging tools I use (esp. Google developer console) work only on chrome.

So if you don’t use chrome, then you need to install it: https://www.google.com/chrome/

 

#2 Google Developer Console

Google developer console is a must have tool for debugging tracking code (aka javascript) and verify installation.

It is already built in the chrome browser.

So you don’t need to install it separately.

Just right click on a web page and select ‘Inspect’:

This will open the developer console window at the bottom of a web page:

As you can see the developer console has got various tabs: Elements, Console, Sources, Network, Performance etc.

Each tab provides valuable insight.

I will explain the usage of some of these tabs later in this guide.

For now, you need to change few settings of the developer console so that it works best for you.

Press F1 (on your windows machine while the developer console window is open)

This should open the ‘settings’ window:

Locate the ‘Network‘ section and then select the check box named ”Disable Cache (while DevTools is open)‘:

Locate the ‘Console‘ section and then select the check box named ‘Preserve log upon navigation‘.

Disable Cache (while DevTools is open)

This option will disable browser caching for the page you are visiting while the developer console is still open.

You need to disable cache so that your browser does not keep loading the previous version of your web page while you are making changes to it for testing purpose.

Your testing could become really hard, if you can’t see the changes you are making.

Preserve log upon navigation

If this option is kept disabled, you will lose debug information as you navigate one from web page to another.

Preserving the log will come handy when you are testing event tracking code.

#3 Google Analytics Debugger

Google Analytics Debugger is a chrome extension through which Google developer console is able to log/record every hit (pageviews, screenview, event, transactions etc) that you send to Google Analytics server.

Once you have installed the extension, enable it by clicking on its icon on the top right hand side of your browser address bar and then refresh the web page:turn on ga debugger

Hover your mouse over the GA debugger button to check whether you see the ‘GA Debug: ON’ yellow notification.

If you see the ‘GA Debug: ON‘ notification then it means the GA debugger tool is enabled.

If you see the ‘GA Debug: OFF‘ notification then it means the GA debugger tool is not enabled.

Get the E-Book (37 Pages)

Learn to read e-commerce reports book banner

Get the E-Book (104 Pages)

 

Make sure that debugger is turned on before you use Google developer console otherwise your console won’t log GA hits and you won’t be able to debug tracking code issues.

Through GA debugger extension you can see error messages and warnings related to your tracking code under the ‘console’ tab:

Note: If you use Google Tag Assistant, you may not need GA debugger chrome extension.

#4 Google Tag Manager Debug Console

Through Google Tag Manager preview and debug console window, you can make sure that your tags, triggers, variables and data layers work as expected.

By default, what you actually preview and debug is the deployment of the current container draft on your website.

To learn more about the GTM debug console, read this article: Guide to Google Tag Manager Debug Console

 

#5 Google Tag Assistant

Google Tag Assistant is a chrome extension which is used to identify, validate and troubleshoot the installation of various Google Tags on a web page.

These Google Tags can be:

Tag Assistant also report on implementation errors and suggest fixes.

This is the first tool I use to verify the installation of various Google tags on a web page.

The tool not only finds the various tags installed on a web page but also report implementation errors and suggest fixes by providing links to help documents.

Tips to use Google Tag Assistant like a pro

Tag Assistant Tip #1

Make sure that you are not using any add-on/extension which disable Google Analytics and/or third party cookies in your web browser.

For example, if you use ‘Google Analytics Opt out Add on’ to filter out internal traffic then you need to disable it (via chrome extension page) before you can use the tag assistant.

Similarly, if you use an adblocker like ‘Ghostery’ then you need to disable it before you can use the tag assistant.

Otherwise, Google Tag Assistant may not work correctly and/or produce false positive results (positive results which are more likely to be false than true).

If GA is disabled (because of some add-on or firewall settings) when you use the tag assistant, you may see following notification in the tag assistant window:

No Google Analytics HTTP responses because opted out code detected‘:

opted out code detected

Tag Assistant Tip #2

Once you have installed tag assistant chrome extension, you would need to enable it before you can use it on a web page.

Locate and click on the Google Tag Assistant icon on the top right hand side next to the browser address bar.

Click on the ‘Enable’ button and then refresh the web page:

Tag Assistant Tip #3

If you want to avoid the hassle of enabling the tag assistant, every time you use it on your website then add your domain to the ‘My Favorities’ list by following the steps below:

  1. Navigate to the domain which you want to add as a favorite in tag assistant.
  2. Enable the tag assistant
  3. Open the tag assistant again and then click on the star icon button

Now next time when you use the tag assistant on your website, it will be enabled by default.

Tag Assistant Tip #4

By default tag assistant is not enabled across browser tabs.

So whenever you open a new tab, you will have to manually enable the tag assistant before you can use it.

If you want the tag assistant to be automatically enabled across all browser tabs then turn on the ‘Auto Validation’ setting.

tag assistant menu button

Tag Assistant Tip #5

Turn on the ‘GA Debug’ setting (see the screenshot above).

When you turn on the ‘GA Debug’ setting, it is equivalent to using the Google Analytics debugger Chrome extension.

In other words, you no longer need to install and use the Google Analytics debugger Chrome extension when the ‘GA Debug’ setting of the tag assistant has been turned on.

Tag Assistant Tip #6

Change the Tag Assistant Default Settings.

Right click on the tag assistant icon and then select ‘Options:

tag assistant options

Select following two checkboxes:

Scroll down and then change the ‘Level of Details’ for all Google tags to ‘Detailed Information’:

detailed information

Make sure that the ‘Default Level’ is also set to ‘Detailed Information’.

Tag Assistant Tip #7

Open Google Tag Assistant in a separate browser tab.

Click on the Google Tag Assistant icon and then click on ‘Menu’ button > ‘Show in separate tab’:

show in seperate tab

The ‘Show in separate tab’ menu item will open the Google Tag Assistant in a separate browser tab.

If you do not use this option then every time you navigate to a different browser tab or reload the web page, the Google Tag Assistant window will automatically hide which will become annoying for you, really fast.

Note: Run Tag Assistant on all important pages of your website (and not just the home page).

To learn more about Google Tag Assistant, read this article: Complete Guide to Google Tag Assistant.

 

#6 Google Tag Assistant Recording

Google Tag Assistant recording is one of the features of Google Tag Assistant.

Google Tag Assistant Recording is used to identify, validate and troubleshoot the installation of various Google Tags across many pages.

Google Tag Assistant by default can not validate tags across multiple pages.

But by using the recording feature, you can make the tag assistant to validate tags across many pages.

Through the recording feature, not only you can record the tags across many pages but you can also record events and interactions for any set of pages you visit, either on your own website or some other website(s).

Watch this short video to learn about debugging the ‘timing’ GA hit and cross domain tracking via the Google Tag Assistant recording feature:

To learn all about the recording feature of Google Tag Assistant, read this article: Guide to Google Tag Assistant Recordings.

 

#7 Google Analytics Troubleshooter Tools

Google Analytics troubleshooters are basically interactive web pages which respond to users’ actions.

These users’ actions can be selecting a particular issue and/or answering ‘yes’ or ‘no’ to questions.

Google has created these troubleshooters around certain analytics topics.

So they are topic specific and can help you in fixing an issue only around that topic.

When you use a troubleshooter, Google ask you series of questions and then based on your answers, suggest you, what data to look at and where, in a GA report and how to resolve a particular issue.

To learn more, read the article: Introduction to Google Analytics Troubleshooter Tools

#8 Google Analytics Diagnostic Notification Tool

Google diagnostic is a feature of Google Analytics which makes regular evaluation of your Google Analytics tracking code, account configuration and data in order to find implementation issues and configuration anomalies.

Once it find issues, it alerts the GA user through a special message known as diagnostic notification (also known as ‘Analytics Notifications’).

These notifications appear as a number over the notification bell in your Google Analytics (GA) view:

Each notification includes a brief description of the problem, recommends a solution and provide following buttons/links.

To learn more about GA notifications, read this article: Understanding Google Analytics Notifications and Diagnostic Messages

 

#9 Fiddler

Fiddler is primarily used by seasoned web developers for debugging website traffic, testing website performance and security and for recording all the HTTP requests and responses between your web browser and the requested web server.

This tool also log each and every hit that you send to Google Analytics server and by using its inbuilt filters you can filter out these hits and analyze them.

fiddler

I use this tool only when I have to debug a mobile app or I have to test lot of code in the production environment (which I normally don’t do) without actually uploading the code to the web server.

For most part, whatever tasks Fiddler can do regarding GA debugging, the Google developer console can do the same tasks equally well and sometimes even better.

To learn more about debugging with Fiddler, read this article: Google Analytics Debugging via Fiddler

 

#10 Google Analytics Tag Auditing Tools

Tag auditing is used to identify various tags (tag is a piece of JavaScript code) on a website for the purpose of:

#1 Upgrading from Classic Google Analytics to Universal Analytics

#2 Migrating Classic / Universal Analytics tags & configurations to Google Tag Manager.

#3 Debugging various Google Analytics tracking code issues

#4 Identifying and removing tags which no longer serve the purpose and should be removed in order to clean the website code.

#5 Migrating non google tags (like Facebook tags, Omniture tags) to Google Tag manager.

In tag auditing we identify all the tags currently being deployed on a website.

Website scraper tools like Screaming Frog SEO spider can be used to identify tags across a website of any size.

I use Screaming Frog for tag auditing and for diagnosing tracking issues.

Don’t be fooled by its name. It is much more than a SEO tool.

It is a powerful website crawler through which you can identify any piece of code (and its occurrences) across a website of any size and it is not very expensive either.

To learn more about tag auditing tools, read this article: Creating your own Google Analytics Tag Auditing System

 

#11 Tool to test Regular Expressions

RegExp Tester is a chrome extension which is used to validate regular expressions (or regex).

We use regex to set up complex goal and funnel pages in GA, to set up complex filters and advanced segments.

Therefore it is important that you first validate the regex before using it to collect data:

regular expression checker

Here the highlighted search result (i.e. optimize smart) is the pattern which matches with my regex.

My regex job is to filter out two words keyword phrases.

To learn more about regular expressions, read this article: Regular Expressions Guide for Google Analytics & Google Tag Manager

#12 JS Fiddle

jsfiddle.net is an online tool which is used to test HTML and JavaScript code.

You don’t need to install this tool.

Just bookmark the website.

I used this tool a lot to test JavaScript codes (like the scroll tracking script, video tracking script etc) without breaking my client’s website:

js fiddle usage

#13 Web Analytics Solution Profiler (WASP)

Web Analytics solution profiler (WASP) is a chrome extension which provides visual representation of the relationship between various tags fired on a web page.

Once installed, it appears as a new tab (named WASP) in your Google developer console window:

web analytics solution provider

#14 Google Analytics Measurement Protocol Hit Builder

hit-is-valid

The best and easiest way to create and test payload data is by using the measurement protocol hit builder tool.

By using the hit builder tool, you can skip encoding the URLs and other type of data.

You probability of creating a valid payload data will be very high, if you use the hit builder tool.

To learn more about the hit builder tool, read this article: Using Google Analytics Measurement Protocol Hit Builder

#15 Postman

postman get

The GA measurement protocol hit builder allows you to send payload data only via POST method.

It won’t let you send payload data via GET method.

It does not allow you to send multiple hits in a single protocol requests.

And above all, it does not provide you the actual code for creating the protocol request.

You can overcome these limitations, by using the Postman chrome extension.

Through Postman extension, you can:

  • Send payload data both via GET and POST method.
  • Send multiple hits in a single protocol requests.
  • Create the actual code, for creating the measurement protocol request.

To learn more about using the postman tool, read this article: Creating and validating measurement protocol requests through postman

#16 Notepad Plus Plus

Notepad Plus Plus is a great tool to edit and debug any file (HTML, CSS, JavaScript, PHP etc) and I have been using it for god knows how long.

Make sure that you never open any file which contains code without this tool in order to preserve formatting (esp. in case of .htaccess file) and to avoid syntax errors:

edit with notepad plus plus

Note: Do not copy paste any code from Microsoft Word as it can corrupt your code.

#17 Other debugging tools

Debugging Basics

In order to understand how debugging is carried out, you need to get familiar with following concepts:

  1. Debugging with ga_debug.js and analytics_debug.js
  2. Understanding _utm.gif

Debugging with ga_debug.js and analytics_debug.js

ga_debug.js is the debug version of Google Analytics JavaScript which is used to troubleshoot GA installation.

You need to upload this script on your website in order to debug GA issues.

However if you are using Google Analytics debugger, you don’t need to manually upload this script.

The debugger will automatically load this script for you for any website you browse via chrome browser.

analytics_debug.js is the debug version of Universal Analytics JavaScript which is used to troubleshoot UA installation.

You need to upload this script in order to debug UA issues.

However if you are using Google Analytics debugger, you don’t need to manually upload this script.

The debugger will automatically load this script for you for any website you browse via chrome browser.

Both ga_debug.js and analytics_debug.js scripts provide detail breakdown of each GIF request sent to Google Analytics server as well as log warning and error messages whenever a problem is detected in the tracking code.

debugging version

If you see ga_debug.js being used in the Google developer console, then it means the website is still using the old Google Analytics library (ga.js):

ga_debug

However, if you see analytics_debug.js being used in the Google developer console, then it means the website is using the Universal Analytics library (analytics.js):

analytics_debug

Understanding _utm.gif

_utm.gif is a transparent GIF image file which contains hit and browser data in the query string.

The Google analytics tracking code sends hit and browser data to Google Analytics server via this file.

This file is requested for each hit (pageview, screenview, event, transaction etc).

Following is an example of a GIF Request:

https://www.google-analytics.com/__utm.gif?utmwv=4&utmn=769876874&utmhn=example.com&utmcs=ISO-8859-1&utmsr=1280×1024&utmsc=32-bit&utmul=en-us&utmje=1&utmfl=9.0%20%20r115&utmcn=1&utmdt=GATC012%20setting%20variables&utmhid=2059107202&utmr=0&utmp=/auto/GATC012.html?utm_source=www.gatc012.org&utm_campaign=campaign+gatc012&utm_term=keywords+gatc012&utm_content=content+gatc012&utm_medium=medium+gatc012&utmac=UA-30138-1&utmcc=__utma%3D97315849.1774621898.1207701397.1207701397.1207701397.1%3B…

Analytics experts interpret this GIF request to debug various tracking code issues.

The next article in the Google Analytics debugging series focus on the interpretation of GIF request, rewriting HTML and testing new JavaScript code on a live website without server access.

Basically the next article is the practical implementation of what we have learned so far.

Check out the next article: Troubleshooting Google Analytics Setup Issues – Part 2

Another article that you will find useful: Google Analytics stopped working? Here are 10 ways to fix it.

Learn about the Google Analytics Usage Trends Tool

The Google Analytics usage trend is a new tool which is used to visualise trends in your Google Analytics data and to perform trend analysis.


Do you want to Learn Web Analytics in 4 Weeks?

  • Learn and Master Web Analytics, Conversion Optimization & Google Analytics from Industry Expert in 4 weeks.
  • Lifetime access to the course + Lifelong FREE course updates.
  • New study material added every few months (lifelong learning).
  • Up to date training material.
  • Most exhaustive course on Google Analytics on the internet.
  • Hundreds of Assessments to test your learning.
  • Your 24/7, 365 days a year reference source.
  • Learn at your own pace and from any place.
  • Risk Free with 30 days 100% Money Back Guarantee.

Take your Analytics knowledge to the next level. Checkout my Best Selling Books on Amazon

Maths and Stats for Web Analytics and Conversion Optimization
This expert guide will teach you how to leverage the knowledge of maths and statistics in order to accurately interpret data and take actions, which can quickly improve the bottom-line of your online business.

Master the Essentials of Email Marketing Analytics
This book focuses solely on the ‘analytics’ that power your email marketing optimization program and will help you dramatically reduce your cost per acquisition and increase marketing ROI by tracking the performance of the various KPIs and metrics used for email marketing.

Attribution Modelling in Google Analytics and Beyond
Attribution modelling is the process of determining the most effective marketing channels for investment. This book has been written to help you implement attribution modelling. It will teach you how to leverage the knowledge of attribution modelling in order to allocate marketing budget and understand buying behaviour.

Himanshu Sharma

Certified web analyst and founder of OptimizeSmart.com

My name is Himanshu Sharma and I help businesses find and fix their Google Analytics and conversion issues. If you have any questions or comments please contact me.

  • Over eleven years' experience in SEO, PPC and web analytics
  • Google Analytics certified
  • Google AdWords certified
  • Nominated for Digital Analytics Association Award for Excellence
  • Bachelors degree in Internet Science
  • Founder of OptimizeSmart.com and EventEducation.com

I am also the author of three books:

error: Alert: Content is protected !!