In case you learn my earlier publish on fetching the Shopper ID from the Common Analytics tracker object with Google Tag Supervisor, you may need agreed with me that it sucks you’ll be able to’t entry the tracker object interface in actual time utilizing Google Tag Supervisor. It’s because the entire set
instructions you add to a Common Analytics tag template happen earlier than the analytics.js is loaded and the tracker object is correctly created.
The opposite subject with the tag template is that there’s no set solution to entry the tracker object anyway. I imply, you should use the set
command, positive, however you’ll be able to’t actually use get
or, for that matter, make use of some other interface strategies you’d need to comparable to plugins (extra on them in this publish).
So, on this publish I need to present a way you should use to really mine the tracker object for no matter info you need, and on the similar time be sure that the information is usable by the point your all-important Web page View Tag fires. It is a notable enchancment to the strategy I talked about within the earlier publish, which was to principally use a Window Loaded Set off to fireside a non-interactive Occasion Tag with the Shopper ID.
This text was impressed and intellectually fuelled by the wonderful Carmen Mardiros (observe her: @carmenmardiros).
X
The Simmer Publication
Subscribe to the Simmer e-newsletter to get the most recent information and content material from Simo Ahava into your e mail inbox!
The tactic
You’ll have to make use of Customized HTML for this. I do know, I do know! It’s an enormous step backwards from the superior, templated world you’re used to. Utilizing a Customized HTML Tag is critical exactly for the explanations I listed to start with. Till the Tag Template helps including arbitrary JavaScript code between the create
and ship
instructions within the template, you’ll have to make use of a workaround.
The upside is that every one you want the Customized HTML code for is to setup the tracker object, after which push an initialization occasion in to dataLayer
, which is able to subsequently fireplace your precise Web page View Tag. So, you’ll find yourself with one further Tag and a really slight delay to your Web page View Tag, however the delay is so minimal it doesn’t actually make a distinction.
Right here’s what is going to happen:
-
Tracker object in your UA-code is created
-
The Shopper ID is extracted from the tracker object as quickly because it’s obtainable
-
When the Shopper ID has been extracted, it’s pushed into
dataLayer
along with the initialization occasion -
This occasion fires your Web page View Tag, and you should use a traditional Knowledge Layer Variable to retrieve the Shopper ID
The Customized HTML Tag
So, begin by creating a brand new Customized HTML Tag, and ensure it fires on the earliest attainable Set off – normally the All Pages Set off.
As for the code inside, you’ll get that out of your Google Analytics Admin, underneath Property Settings -> Monitoring Data -> Monitoring Code.
Copy-paste that into your Customized HTML Tag. Now, proceed to take away the road which says ga('ship', 'pageview');
. We’re eradicating this as a result of we nonetheless need to use the precise tag template for sending the pageview hit.
Now, if there are any modifications it is advisable do, comparable to including extra trackers, you’ll be able to set them up right here. This information has been written with a reasonably primary setup in thoughts.
NOTE! Any modifications to the tracker, comparable to allowLinker : true
, customized cookie settings, and so forth have to be setup on this Customized HTML tracker, in order that the Shopper ID you may be fetching from this practice tracker matches the one utilized by your principal Web page View Tag.
The following half is essential. The analytics.js library is loaded asynchronously, which implies that you don’t really know when the tracker object has been created and its get
technique will be invoked. So, the library enables you to cross a callback perform to the ga
object, which shall be executed as soon as the library has loaded and the tracker has been created. As I point out to start with: this characteristic just isn’t obtainable within the default tag template, which is why we’d like this workaround.
So as to add the callback, you add the next rows of code after the ga('create', ...);
expression:
ga(perform(tracker) {
...any strategies which want the tracker object
});
Any code throughout the callback perform shall be executed solely as soon as the library has been loaded, the tracker has been created, and the tracker object responds to interface strategies. On this callback perform, we’ll first fetch the Shopper ID, after which push it into dataLayer
along with an initialization occasion:
ga(perform(tracker) {
window.dataLayer.push({
'occasion' : 'trackerReady',
'cid' : tracker.get('clientId')
});
});
As you’ll be able to see, I’m invoking the get
command of the tracker object, and asking to retrieve the Shopper ID from the tracker. This wouldn’t be attainable with out the ga(perform(tracker) {})
name.
My private, completed instance for the Customized HTML Tag seems like this. Bear in mind, any customizations you want for the tracker object must go right here as effectively, so be sure you learn up on easy methods to arrange superior configurations in your Common Analytics monitoring code.
<script>
(perform(i,s,o,g,r,a,m))(window,doc,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', '{{GA Monitoring Code}}', 'auto', {'allowLinker' : 'true'});
ga('require', 'simoPlugin'); // Any plugins you need to load would go right here
ga(perform(tracker) {
window.dataLayer.push({
'occasion' : 'trackerReady',
'cid' : tracker.get('clientId')
});
});
</script>
Just some feedback on the customizations:
-
{{GA Monitoring Code}} is a Lookup Desk Variable which returns the property ID relying on just a few situations.
-
ga('require', 'simoPlugin');
is the place you’ll load any plugins you need to use along with your Tags. That is lacking from the tag templates, and I actually hope we’ll get the prospect to load plugins quickly.
That’s it for the Customized HTML Tag. The remainder may be very easy stuff.
Knowledge Layer Variable and Customized Occasion Set off
The 2 different stuff you’ll want are a Knowledge Layer Variable for the Shopper ID, and a Customized Occasion Set off for the trackerReady
occasion.
Nothing sophisticated about this. The Set off is absolutely easy as effectively:
After you have these two setup, all it is advisable do is modify your current Web page View Tag to accommodate these modifications.
My Tag, for instance, now has the Shopper ID as a Customized Dimension, and it’s set to fireside with the Occasion – trackerReady Set off we simply created.
Abstract
That is a kind of articles that I hope turns into out of date quickly. The present Common Analytics tag templates don’t allow you to run arbitrary JavaScript (e.g. load plugins) or entry the tracker object after it has been created, however earlier than the ‘pageview’ hit is distributed.
That’s why you want this workaround. Alternatively, this isn’t precisely a really complicated factor to do, as you’re solely creating one extra Tag to arrange the tracker and channel all the following tags to not fireplace till the tracker object callback perform has been executed.
Time will inform when the Common Analytics tag template helps these options. Personally, I hope quickly. Google Tag Supervisor is already the de facto implementation mechanism for Common Analytics, but when it doesn’t assist superior configuration of the tracker object, bigger organizations particularly is likely to be deterred from migrating till such options are supported out-of-the-box.