How to set dynamic value to click event rule based on css?

[julib23]

Hi All

I am new to DTM and would greatly appreciate some advise on how to track user navigation from a group of items in the same class.

For example, there is one class in a footer and I want to fire a rule when someone clicks one of these links, passing the value of the id into a custom link variable or a prop variable. Every example I am seeing in the videos only fires on a specific value existing. Does that mean I have to write a rule for each of these conditions or can someone please advise how I can leverage a click rule for a group of items?

EXAMPLE
<li class="appBottomLink" id="aboutLink">
           <a href="http://www.test.com/about" id="aboutLink" title="About" target="_blank">About</a>            
           </li>    
                            
<li class="appBottomLink" id="supportLink">
         <a href="http://www.test.com/support" id="supportLink" title=“Support" target="_blank">Support</a>
           </li>
                                                   
<li class="appBottomLink" id="warrantyLink">
         <a href="http://www.test.com/warranty" id="warrantyLink" title="Warranty" target="_blank">Warranty</a>
         </li>  

Thanks in advance!

[theGovernor · Accepted solution]

@julib23 -

Under Conditions, specify the following in the "Element Tag or Selector" box:

    [class=appBottomLink] //include the brackets

Then, in the Adobe Analytics section, select the desired prop/eVar and use the getAttribute() method to grab the ID. For example:

    %this.getAttribute(id)%

In the three examples from your original post, the values passed to Adobe would be:

• aboutLink
• supportLink
• warrantyLink

~ b

[julib23]

Thanks Brian!!

I am saving this for a reference!!

So this is an event-based rule, to set prop1 with the value passed in the id for my case. I so appreciate the fast response!!

Juli