Link click tracking attribute

The link click tracking attribute is a snippet of HTML code used to track clicks on links on your website from Connectif.

 

What is it and how do I use this attribute?

The "data-cn-track-click" attribute can be used on any link that you want to track and that is not part of Connectif content, provided that Connectif JavaScript is installed on the website.

In addition, accompanying the "data-cn-track-click", the "data-cn-alias" attribute can be used to assign an alias to the link to make it easier to identify, for example in the "When web content is clicked" node.

  

Content links created in Connectif are monitored automatically.

 

Other considerations

The link click tracking attribute allows you to specify a value to dictate how the tracking mechanism should behave. 

  

If the values are not indicated, the link click tracking mechanism will behave by default in one way or another depending on the "href" it accompanies.

1. Async

This value indicates that the mechanism will count the click without blocking navigation. This is the default behavior for links to sections on the same page or special links such as "mailto:" or "tel:".

<a href="#mysection" data-cn-track-click="async">
my section
</a>

 

2. Sync

This value indicates that the mechanism will count the click before navigating. 

<a href="https://www.website.com/product/list" data-cn-track-click="sync">
my products
</a>
 

The sync value is more guaranteed to capture any click. However, it blocks navigation until the tracking has been carried out, so it is recommended to limit its use.

3. Track-click

This value indicates that the mechanism will redirect the contact to the destination after tracking. This is the default behavior when the link leads to an external web page.

<a href="https://www.website.com/product/list" data-cn-track-click="track-click">
my products
</a>

 

4. After-redirect

This value indicates that the mechanism will count the click after having performed the navigation. This is the default behavior when the link leads to an internal page.

<a href="https://www.website.com/product/list" data-cn-track-click="after-redirect">
my products
</a>
 

The "data-cn-track-click" attribute will not work on "<a>" tags without a "href" attribute.

 

Example

Once the attribute is included, it will look different depending on the link type: 

  • Internal to the website: links that remain within the website or domain.  
    <a href="https://www.website.com/product/list" data-cn-track-click>
    my products
    </a>
  • External to the website: links whose destination leaves the website and navigates to other domains. 
    <a href="https://twitter.com/myprofile" data-cn-track-click>
    my profile on twitter
    </a>
  

In these cases, Connectif will replace the href of the link with a tracking URL so that the navigation goes first via Connectif, is tracked, and then redirects the contact to its destination.

  • To sections of the same page: links that point to a specific section of the same URL.
    <a href="#mysection" data-cn-track-click>
    my section
    </a>
  • Special links: like "mailto:" or "tel:".
    <a href="mailto:info@company.com" data-cn-track-click>
    contact us
    </a>
  • Links with JavaScript code: Links that execute JavaScript code can also be captured. The "data-cn-alias" attribute is required to give names to these links.
    <a href="javascript:alert('Hi');" data-cn-track-click data-cn-alias="say-hi">
    say Hi
    </a>

 

 

Congratulations!
You’ve reached the end of the tutorial.

  

Do you have questions?
Don’t forget, our Connectif specialists are here to help you. To contact them, just open a Support ticket by clicking the blue “Help” button on your dashboard.


Keep learning!

To make the most of your Connectif account, we recommend reading these articles next:

Was this article helpful?
0 out of 0 found this helpful