-
Sure, here’s how it works.
Suppose you’ve got a simple version of the HTML code. A user clicks on an element, let’s call it “z”. Now when the user does this, Google Tag Manager (GTM) springs into action and captures the “data-analytics-title”.
‘Yeah, but why don’t we get the values for the “data-analytics-section-engagement” and “data-analytics-region” too?’ I hear you ask. Well, it’s because those are different elements entirely!
What we need to do next is to find these elements, y and x. You see, all of these tags are related, just like a family tree! We’ve got the clickable ‘z’ element that originates from the ‘y’ and ‘x’ elements.
Now there are a couple ways we can find these, but I recommend trying the Element.closest() approach. We’re gonna use this to navigate from our click point, the ‘z’, upwards to the ‘y’ and ‘x’ elements.
Here’s a bit of JavaScript that might help you capture those elusive “data-analytics-section-engagement” and “data-analytics-region” values:
`javascript
var clickElement = {{Click Element}};
var findXElement = clickElement.closest(‘x’);
var dataAnalyticsRegionValue = findXElement.getAttribute(“data-analytics-region”);
var findYElement = clickElement.closest(‘y’);
var dataAnalyticsSectionEngagementValue = findYElement.getAttribute(“data-analytics-section-engagement”);
`Oh, before I forget: you may need to tweak the code slightly to fit your real HTML content. But hey, isn’t the process of discovery fun? You’re on the right track!
I hope this helps. Happy coding!
