Reduce repetition of GTM variables (UPDATED)
Advanced GTM Post
Repeating variable functionality
You may have encountered a situation where you need to apply the same operation to multiple different GTM variables and end up repeating yourself for each dataLayer variable that needs the operation.
I’ve seen this scenario a bunch of times and it makes me sick. I hate wasteful repetition. In “normal” software development, you’d write a utility function that expresses the operation once and you call it multiple times. Can’t do this in GTM. No parameter passing in variables. So you end up with multiple variables doing the same thing. These all need debugging, maintaining and they continue to grow.
We can do this better.
Say we have an app handles hotel room bookings. We have a booking start date and an end date on the dataLayer – “bookingStart” and “bookingEnd”.
They all do the same thing!
This list is only going to get longer and need more maintenance attention as time goes on.
Let’s look at how we can extract the day and month names of each booking date with far less repetition.
You still need the two source date variables “bookingStart” and “bookingEnd”. We’ll assume they’re typical date values, say 2016-09-28 and 2016-10-1. For this demo, I’ll set them up as constants:
We expect to be able to record our day and month variables as custom dimensions in a pageview like this:
For each of the CD values, we still use individual variables but they all make use of the same lookup methods exposed by the custom HTML tags. Here’s the booking start day variable:
This scales. Once we’ve got our lookup methods available from the custom HTML tags, they can be fed the relevant day or month index to lookup and return. We can reuse the lookup methods as many times as we like to populate a tag with the right values.
Here’s the booking start month tag – very similar:
The booking end day and booking end month variables are just the same but we’re running getDay and getMonth on the booking end date variable.
Time to test
Proof here that the right values are visible in the variables tab in preview mode:
See, when I look at the CDs for the pageview tag in the event summary, they’re all set:
And we can see the CD values set in the pageview tag sent to GA:
But a mildly alarming moment when we look at the tag payload in preview mode on the Page View event…What the…!?!?!?:
Remember that variables associated with a tag are evaluated on the event that fires the tag. As the tag details are rendered, the variables have not yet executed.
This is a frequent gotcha with variables and the plot gets even thicker when you consider that you can’t control the order of variable execution.
Be nice, wouldn’t it?
If you’ve read the comments, you’ll have seen the fantastic generosity and smartness of my friend Simo. Here’s Simo’s suggested solution in action:
The day_month variable:
That function returns an object that is comprised of two functions getDOW and getMonthName. The date parse and array lookup functionality is pretty self explanatory.
The fact that day_month returns a function is worth noting. Look what GTM says day_month returns in Preview Mode:
Knowing this, the booking start day CD field value can’t be:
Rinse and repeat for the other variables and our CD config now looks like this:
And when we spin this up in Preview Mode we see that is works like a charm: