So I've found a few similar questions, but often either outdated, not exactly what I'm searching for or they don't use Google Tag Manager but write their tags in the <head>
.
----------- Current situation -----------
We use Google Tag Manager to inject tags such as Google Analytics on our website. We use multiple tags depending on what needs to happen; such as:
All the data goes perfectly to Google Analytics
----------- The problem -----------
However, we also receive data from other environments such as localhost:3000
or https://dev.ourdomain.com
, which can result in inaccurate data.
----------- What we want -----------
Is a way to separate that data. By either:
Between point 1 and 2, I'm more of a fan of the first way, as this would separate existing data into production and development data.
----------- Suggested solution -----------
I've been thinking about using a new property and then, using Google Tag Manager, I would return Google Analytics Settings depending on the current domain. Production would return UA-code-1
and development UA-code-2
. The only issue however, is that every Google Analytics tag in GTM must be duplicated. With one containing the Google Analytics Settings for production, the other for development.
I was hoping there was a better way to tackle this, any suggestions?
You can still use single Google Analytics settings variable in your GTM and have a single instance of each tag but you can use some Lookup Table / custom JS variable inside your GA settings variable in place of tracking ID.
Update:
Note that the GTM Environment
variable is incompatible with the lookup method and debugging/previewing. When previewing, the value is something like Preview window 1121212
. In order to workaround this, an easy lookup table based on production {{Page Hostname}}
works well with a default value fallback to your staging tag value.