One of many harder ideas in Google Tag Supervisor is the information mannequin. In essence, the information mannequin is what Google Tag Supervisor makes use of to populate the Knowledge Layer variable. You is likely to be tempted to suppose that it’s the identical factor because the dataLayer
array, however it’s not.
The information mannequin is a illustration of the keys and values you push into dataLayer
. Everytime you push any key into dataLayer
, GTM grabs this key and updates the corresponding key in its information mannequin with the brand new worth, or within the case of objects and arrays merges the previous and the brand new worth collectively.
On this #GTMTips article, I’m fully indebted to Mr. Jethro Nederhof from Snowflake Analytics. He revealed these two tips in Measure Slack, and I requested if he’s OK that I publish them on my weblog. He kindly agreed, which isn’t suprising, since his generosity additionally spawned our co-authored article on monitoring shopping conduct a couple of months again.
X
The Simmer Publication
Subscribe to the Simmer publication to get the newest information and content material from Simo Ahava into your e-mail inbox!
Tip 85: Two easy information mannequin tips
Each suggestions need to do with how the information mannequin processes keys and values pushed into it.
The primary trick helps you to stop recursive merge from occurring (helpful on single-page apps the place you don’t need to persist values pushed in earlier pages, for instance).
The second trick helps you to entry what the present state of the information mannequin is. This may be helpful for plenty of issues, however particularly in case you’re debugging your setup it is likely to be helpful to see all they keys and values which can be at present situated within the information mannequin’s desk.
Trick 1: Use _clear: true
to stop merging of the keys within the object
Let’s say you’re pushing some product impressions into the dataLayer
. The primary push appears like this:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
merchandise: [{
sku: '123',
name: 'Thick as a Brick'
},{
sku: '234',
name: 'Aqualung'
}]
});
At this level, the important thing merchandise
within the information mannequin would have two objects representing the merchandise that have been pushed. When you have been to create a Knowledge Layer variable for merchandise
, that’s what you’d additionally get because the return worth of the variable.
Then let’s say the consumer strikes to a different part of the location and not using a web page load (so it’s a single-page app), and on that web page there’s only one product impression, so the location runs the next code:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
merchandise: [{
sku: '345',
name: 'Close to the Edge'
}]
});
You’d anticipate the information mannequin to now have only one product within the merchandise
array, however on account of how recursive merge works, the information mannequin appears like this:
{
merchandise: [{
sku: '345',
name: 'Close to the Edge'
},{
sku: '234',
name: 'Aqualung'
}]
}
As you’ll be able to see, the second product of the primary push persists, as a result of the brand new product was merely merged with the previous merchandise
array.
And right here’s the tip. To stop this recursive merge from occurring, you might want to push the important thing _clear
with the worth true
in the identical object the place you push the keys you don’t need to merge with their counterparts. So the second push turns into:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
merchandise: [{
sku: '345',
name: 'Close to the Edge'
}],
_clear: true
});
So now the important thing within the merchandise
array of the information mannequin solely has one object inside.
Trick 2: Get the thing illustration of the present state of the information mannequin
You may all the time use window.google_tag_manager['GTM-XXXXX'].dataLayer.get(key)
to fetch the present worth of the given key
from the information mannequin. However if you wish to get the full contents of the present information mannequin, you might want to run the next command:
var dataModel = window.google_tag_manager['GTM-XXXXX'].dataLayer.get({
cut up: operate() { return []; }
});
console.desk(dataModel);
When you run the command above within the JavaScript console of your browser, it’s best to see a pleasant desk view of the present information mannequin:
What a easy technique to see what the present state is.
Abstract
I’ll be the primary to confess: these are very technical, area of interest tips. You in all probability gained’t want them day by day, and even month-to-month, in your implementations.
Nonetheless, I firmly imagine that understanding how the information mannequin works is likely one of the keys to unlocking Google Tag Supervisor’s actual energy.
And, once more, a enormous because of Jethro Nederhof for revealing these easy tips. He will get full credit score for the substance of this text.