Apply Click Goals programmatically

On this page

The default way

In the default case, the application of a click goal works in this manner:

On the Platform:
  1. The click goal is created
  2. The click goal is set for the experiment
On the Page:
  1. Check if the goal is valid for the current page
  2. The goal is triggered when element is clicked

The programmatically way

The steps regarding the Platform are the same as described above. What is different is the second step on the page.
If you need to add more elements (than the css-selector matching ones) triggering the click goal, just add the attribute data-ablyft-clickgoals="GOAL_ID" with the matching ID* of the click goal to those elements.
See example below. 

<a href="/step_2" data-ablyft-clickgoals="12345678">Click here</a>
  • You can add multiple Goals to one Click/Element - just separate the IDs with a Comma
  • You can find the goal id when you edit an existing goal