Tracking clicks on different multiple results on a webpage

Data collection and tags
1

Hi, I’d appreciate if anyone could confirm I am on the right track to collect this info with Piwik Tag Manager:

Scenario: we’ll have a page to showcase our app integrations. People can click on each app they’re interested in integrating with. These apps are shown like cards. See snapshot from our CMS below. We’d like to collect those clicks and see that as an event on Piwik analytics along with exact result they clicked on. So we have a custom report on clicks on the integration page results and on which ones, ordered by which ones are clicked the most to lowest.

Snapshot:

Captura de pantalla 2024-08-29 a las 14.13.16
Captura de pantalla 2024-08-29 a las 14.13.162676×1316 374 KB

How-to:
I’d say that on our backend, we would need to set a css class that’s common to all those ‘card results’, for easiness, eg: integration-app. And then apply an individual custom id to each card, in the CMS, eg: custom id= slack

Then, on Piwik Tag Manager:

  1. Create Trigger: Click type: with Event Conditions → Click Classes contains “integration-app” (or should it be .integration-app)
  2. Then, create an async tag, Custom event → where Category is integration-app and then action: {{Click ID}}(see test snapshot below)

Captura de pantalla 2024-08-29 a las 14.30.26
Captura de pantalla 2024-08-29 a las 14.30.262630×1008 127 KB

What am I doing wrong? Or am I missing creating a Variable instead, and if so which one for our purpose?

Thank YOU

2

For me it looks like you’re just on the right track :slight_smile:

Ad. 1 for “click classes” it should be name of the class so “integration-app”
You would use CSS selector with the dot (“.integration-app”) when using “Click element matches” rule
Ad. 2 - makes perfect sense, along with the config you’re showing on the screenshot. I’d approach that the same way :slight_smile:

1 Like