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 wether the goal is valid for the current page
  2. Tagging every regarding html element with the attribute "data-ablyft-clickgoal"
  3. Bind clicks to those elements 

The programmatically way 

The steps regarding the Platform are the same as descripted 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. 
Did this answer your question?