Expand my Community achievements bar.

Join us for the next Community Q&A Coffee Break on Tuesday April 23, 2024 with Eric Matisoff, Principal Evangelist, Analytics & Data Science, who will join us to discuss all the big news and announcements from Summit 2024!

Basic button tracking

Avatar

Level 5

Hi everybody!

I´ve a really basic question in regard of button clicks. We only want to know the number of clicks of a specific button. I know we can do that with class/id. 

 

But is there a way to also track that with data layer? my dev team created a data layer that when a click is done it triggers the data layer (I believe its a data layer push as the page doesn't load again) and this data layer contains the "event: eventname" and "userId: xxxx".
Since the goal with this is to only get number of clicks, would it be best practice to do it with CSS? 

Is there a way for it to work with data layer also? would the data layer need to send a value? for instance, now we have something similar to this:


window.dataLayer = window.dataLayer || [];
dataLayer.push({
 'event': 'nameoftheevent',
 'UserId': xxxxx,
 'loggedin': 'True' 
});

 but to track the number of clicks would we need to set something like a value=1 (click)

 

window.dataLayer = window.dataLayer || [];
dataLayer.push({
'event': 'nameoftheevent',
'value': '1',
'UserId': xxxxx,
'loggedin': 'True'
});

if the data layer option works, how can I create its data element and rule? we have been using data layer manager and adobe analytics data string extensions so set data layer up.

thanks in advance

8 Replies

Avatar

Community Advisor

Unless your using some type of page coding that doesn`t support css then buttons and links should all be trackable via Activity Map. Will save you and devs a ton of work and allow all sorts of flexibility. Even has a browser plugin for a sort of heat map.

 

Caveats

If you have 5 buttons with same name then may need to add some code IDs to make them discernible.

Some post page load clicks may need s.tl style of click tracking

Avatar

Level 5

our sites are coded in low-code systems. In one of them, activity maps work and in the other, it doesn’t work at all! The chrome plugin doesn’t even open. 

Also, because it’s low code the classes are automatically created and sometimes we have multiple buttons with the dames classes and even text! 

Even the the website (coded in drupal) that activity maps work, it’s not really reliable as the names of buttons sometimes are messed up and sometimes it doesn’t even identify buttons/ link clicks. 

I do know we can always ask for the dev team to customize the classes one by one, but since we are already adding data layer, I would like to know if it’s also possible to track clicks with it. 

Avatar

Community Advisor

ok I see . I think then what could be an option is to just use custom link tracking,

 

add , props, evar, events as needed. Im guessing much of what you have in data layer can be attributed to those items so its an easy thing to add.

 

https://experienceleague.adobe.com/docs/analytics-learn/tutorials/implementation/using-javascript/cu...

 

Failing using a custom link you could use a direct call rule for the click. Then set data elements for for the various elements that you set in your data layer on click and reference in your direct call rule.

Avatar

Level 5

Using launch would be the best option for us.

 

but in that case, is the data layer sample I originally posted correct?? 

and how set it up on launch?

Avatar

Level 5

Unfortunately this documentation doesn’t answer my question.

 

but thanks anyway 

Avatar

Community Advisor

Yah the page itself is a low quality explanation bit there is a link on it:

 

https://experienceleague.adobe.com/docs/analytics/implementation/launch/elements-to-variable.html?la...

That link then in left side has a section on:

https://experienceleague.adobe.com/docs/experience-platform/tags/ui/data-elements.html?lang=en

 

This is a bit more robust see if it give you the info you need.

 

It would be great if Adobe have a more detailed step by step for sure.

 

GLTU

 

Avatar

Community Advisor

You can use the Google Data Layer extension to help you work with your Google Tag Manager-based dataLayer.