In my opinion, Google Tag Manager is one of the most powerful tools (especially in the ecommerce space) a marketer with little to no development experience can use, but I've yet to see a well-optimized container that doesn't eat away at a site's performance. In this guide, I'll share with you my top secrets for a clean, well-structured and optimized containter that will enhance your workflow and not turn your site into a bloated javascript mess.
Naming Conventions (and why they are needed)
Having agreed-upon universal naming conventions is helpful for a multitude of reasons, the main one being that you might not be the only one working on a project. Having common unwritten rules everyone abides by ensures a clean working environment and less confusion in the future when you eventually have to come back and make updates in a contianer.
In the world of programming, having good naming conventions helps with understanding code at a glance. Programming has an interesting phenomenon: it is often easier to write code when you are “in the zone” than to read it when you return to it three months later. If you name your variables in JavaScript something cryptic or irrelevant, you're making it harder for yourself and others when that piece of code needs to be revised.
If you have to add a lot of comments to explain what you are doing, it is a sign of a messy workflow.
Example Code
Messy Code:
const temp_one = (param) => {
let result = "";
if (param >= 18) {
// Check if the number is higher or equal to 18
result = "over eighteen";
return result;
} else if (param < 18) {
result = "underage";
return result;
} else if (typeof(param) !== 'number') {
// Check if the parameter is even a number
result = false;
return result;
}
}
Improved Code:
const analyse_age = (age) => {
if (typeof(age) !== "number") {
return false;
}
return age >= 18 ? "over eighteen" : "underage";
}
The same principles apply to tools like Google Tag Manager (GTM). By following best practices, you can often identify redundancies in the setup: duplicate variables, triggers, and tags with different names but similar functions. Other issues might include uncategorized tags (e.g., custom HTML or Facebook Ads) that belong to the same family, or bloated lookup tables. Cleaning up these elements results in a leaner GTM file, a more digestible container, and a less error-prone analytics tracking setup.
Preserving Historical Data
Whether performing a major overhaul, it’s essential to document what the previous tag names were and what they will be renamed to. This ensures you can look back and understand how a specific tag was set up in the past, even if it has been renamed. Without this, tracking historical data becomes difficult.
Pro Tip: When publishing a container, you can add references (links) to relevant documents or tickets in the description for a better "paper-trail".
General Naming Conventions
The best naming convention is often the simplest one: name the thing exactly what it is or what it references, followed by any necessary modifiers. Here are some specific guidelines:
Variables
Variables should use a small abbreviation of the variable type followed by the name. If the name cannot be derived from a variable or it is custom code, name it appropriately. For example:
- Data Layer Variable → DLV
- Custom JavaScript → CJS
This naming convention makes it easy to identify variables in the auto-suggestions. After renaming variables, check for duplicates or copies with different names. Remove duplicates and remap references to the cleaned-up variables. Similarly, assess variables with overlapping functionality to determine if they can be consolidated.
Pro Tip: If a lookup or RegEx table uses a default value that is already mentioned in a previous field, the default can often be omitted. Additionally, unused variables with no references should be removed.
Bonus Pro Tip: You can select all variables and hit 'delete'. You will get an error that these variables are referenced somewhere - you can use this to quickly find ones that have no references anywhere (I wish GTM automatically showed you variables with 0 references like they do with triggers).
Triggers
Triggers should follow a similar principle. Name triggers based on the dataLayer event name, using a
format like:
{{EVENT}} - {{MODIFIER}} - {{ANOTHER MODIFIER}}
Before beginning any cleanup, sort triggers by their associated tags. Remove triggers that have no tags attached, as they are redundant. If needed in the future, you can retrieve them from previous published versions in GTM.
Tags
Tags are more flexible than variables or triggers. A good practice is to use the {{service name}}
followed by the {{context}}.
Tags without triggers, or paused tags that haven’t been used for a long time, should be removed. Tags that are part of sequencing or cleanup (e.g., firing one tag before or after another) can remain as needed.
Final Cleanup and Publishing
GTM folders can help organize tags, though it’s not necessary to be overly strict with triggers and variables. When publishing, include relevant links (e.g., ticket, Google Sheets) in the version description. Name the version descriptively, such as “GTM Cleanup.”
After cleanup, compare the previous and updated versions by downloading both. The optimized version should be lighter, more readable, and easier to work with in the future. ✨