Slight deviation this week, but we’re still on the path to glory a setup of Adobe Analytics and Dynamic Tag Manager (DTM) that is as close to perfection as possible.
The deviation today has to do with a question I was asked about a month ago: how can I track an attribute of a clicked element using an Event Based Rule?
Event Based Rule
Remember: DTM is based on rules. You have rules that fire on page load and rules that can be executed when something happens on the page.
The latter are called Event Based Rules and they are powerful for custom link tracking and for dynamic sites that use a lot of AJAX and DOM manipulation.
Event Based Rules, like all rules, allow you to set Adobe Analytics “variables”. You can use Data Elements for that, for example. This is great with a Data Layer, but I think I have mentioned that before.
For the question above, the real puzzler was: how do you make a Data Element that refers to some attribute of the clicked element?
And it turns out: you don’t have to!
%this%
The official documentation on Global Variables in DTM spells out an example that is interesting under the heading “Dynamically Populate Variables”:
For that, it uses a syntax that is very close to how you access Data Elements. In fact, the syntax is exactly the same:
eVar1="%this.id%"
I can assure you that “%this.id%” is not a Data Element that I built. This is built-in functionality.
So I had to play around with that a little bit.
Say I wanted to track the class of the element that surrounds whatever I clicked on. Turns out that is possible:
prop41="%this.parentElement.className%"
This is the rule:
The quest for perfection will continue in 2015. For now, switch off your machines and brains. Have a good time off and a quiet time with your families!
Simplifying is the way 🙂 Jim Gordon has written a real good post about DTM Cheating. One Part is using the basic %% syntax -> http://jimalytics.com/tag-management/dynamic-tag-manager-dtm-cheat-sheet/
LikeLike
Thanks for that link, Till, very helpful!
I’m always amazed how many other blogs out there have interesting information and I don’t even know about them!
LikeLike
Hi Jan,
wish you a happy and succesful new year first and ‘that is as close to perfection as possible’ sounds very good, so I’m looking forward to our project 😉 BTW: %this% is pretty cool 😉
LikeLike
Hey Jan, not even sure where to begin to google for this so I thought to ask you. Have you ever set more than one data element to a variable?
Example: From DTM, I set %country%:%language% to a variable (say, evar5) and it seems to work – it loads “ca:en: to my evar5
just wondering if there is a catch to this?
LikeLike
Not that I know of, no.
LikeLike
Hi Jan, how about embedded youtube videos on a web page, which has a class surrounding it? Do iframes make this more difficult?
Example of embedded video I want to track the usage/ interaction of
http://jobs.theguardian.com/employer/199083/the-childrens-trust/
LikeLike
Hi Matt,
iframes make everything more difficult indeed. Loading content in an iframe is almost the same, technically, as loading it in a different browser.
If you really want to track your videos, it also makes sense to instrument the player, rather than using the embedded Youtube player.
This is a piece of work, and it might not be worth it, depending on your site.
One alternative would be to use the YT-provided numbers. As for using DTM, I have to ask around a little bit…
LikeLike
Jan what would be the %this.####% value here if I’m wanting to grab the value between the .
Thanks
“If you are positive, if you want to help people, if you’ve got ideas then you can come and you can do it.” Find out what you could learn from a Raleigh expedition in this video from Tanzania.
LikeLike
Hi Matt,
Not sure I understand your question. Which part do you need exactly?
LikeLike
Congratulation for your blog, I’ve discovered it few days ago and I’m very happy to catch a new source of tech information about DTM.
Concerning data element and event based rule, we can consider that we don’t have to use data element but it is better in a lot of cases for factorization purposes.
The challenge is to workaround the fact that DTM data element doesn’t manage “Click Element” and you have to do the job differently (contrary du GTM as example).
The way I find to do it after several tests (sometimes I’m angry with the Adobe documentation…because too light):
To factorize attributes scrapping, I transmit my clicked element from the rule to the data element using parametered signature.
:))
// click event based rule
s.products = _satellite.getVar(‘clicked product’)(this);
// custom js data element : clicked product
return function(a) {
return a.getAttribute(“data-product-category”)+”;”+a.getAttribute(“data-product-id”);
}
LikeLike
That, Mehdi, is insane and genius, and I am in awe!
Thanks for sharing!
LikeLike
… not to forget beautiful, and practical beyond belief!
Merci, Mehdi, pour cet astuce brilliant!
LikeLike
This is wonderful information to know. Thanks 🙂
LikeLike