Suppose you have a website that contains similar IDs but for different elements or have dynamically generating IDs, particularly in e-commerce based sites, the web application provides you with the option to track dynamic selectors which aid in tracking clicks intelligently on those specific elements that have dynamically changing attributes.
What are the benefits of tracking dynamic selectors?
When heatmaps are run without tracking dynamic selectors, this is how the result looks like:
All clicks are directed to a single element because a similar ID is given to all elements.
However, when the dynamic selectors are tracked, this is the result
The clicks are captured accurately and are spread accordingly.
This option works by allowing you to enter specific conditions for the experiment to rule out from taking into consideration for the experiment.
When can it be used?
When a visitor clicks the 3rd item from the list of top 5 best selling items, heatmaps may misinterpret that the click is made on the 1st item because all the 5 items have a similar ID - “product_image”.
In this scenario, using the Track dynamic selector option to specify “product_image” as the excluding selector conveys to Freshworks that it is a dynamic item. Therefore, the web application automatically tracks and excludes the elements with this ID. Now, it takes the next hierarchical element to the ID which differentiates those 5 items.
When the scrolling banner in websites generates ID dynamically. You can use the Track dynamic selector option to exclude dynamically changing attributes.
How to create an experiment using the “Track dynamic selector” option?
Here’s how you can implement the Track dynamic selector option for heatmaps:
On your left panel, click the MARKETING AUTOMATION button and select Heatmaps.
Click to start a new experiment
Click open an existing experiment and click .
This takes you to the configuration page of the Heatmap experiment.
- Click ADVANCED OPTIONS and scroll down to TRACK DYNAMIC SELECTOR selection. Under “Track dynamic selector”, there will be two drop-down boxes and a text box. The first drop-down box lets you select between ID and Class.
The subsequent drop-down box gives you a choice between Contains and Regex. While the former is useful when you want to specify certain text or string as the excluding condition, the latter is suitable when you want to cite a regular expression.
The text box allows you to enter the condition that you want the web application to track dynamically and ignore.
After defining the necessary condition, click the Now, the web application will track the elements accordingly pertaining to the conditions you’ve specified. button.