Dynamic Tag Management

aleksl29574141 · 12/8/16

Hi, I’m new in DTM and faced some problems with tracking button clicks.

In my site I have slider with 2 buttons on it. I would like to track clicks on them – firing an event and eVar with name of button. It looks like this:

And here is the code:

As You can see both buttons use the same class .heroCarouselButton. I tried to put text value of this class into data element:

And then use it in event based rule on click on button:

But when I test it eVar51 always has text value of first button – “Plans & Pricing” even if I click on View Demo button.

Thanks for any help.

jantzen_b · 1/11/17

Hi Aleks,

Did my previous reply answer your question? Overall it looks like you'll need to be more specific with your CSS selector or switch to using Javascript to capture the value. Customers in your situation often use the "this" function of Javascript. Here are a few resources to get you started:

Mozilla Dev Network - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

W3Schools - http://www.w3schools.com/js/js_object_definition.asp

Thanks,

Jantzen

View solution in original post

jantzen_b · 12/8/16

Aleks,

The data element code is running the first time it is called. In this case, it is called when the rule containing eVar51 = "%Carousel Button Name%" fires. Unfortunately, the way CSS selectors work results in the first instance of an element with a match to the CSS selector is read. In this case, "Plans & Pricing" is the text of the first element that matches the CSS selector.

In order to get around this, you'll likely need to use javascript to help DTM understand which element you're trying to capture.