From Friday July 1, 2022 we're moving accounts that were created before April 20, 2022 to our updated pricing model.
Under the updated pricing model, we've grouped Surveys and Feedback into a separate product called Ask that’s priced based on the number of responses you want to collect across Surveys and Feedback. Heatmaps and Recordings will be grouped into a separate product called Observe and will still be priced based on the number of daily sessions.
Both products, Observe and Ask, will have the Basic (free), Plus, Business, and Scale plans available, and the selected plan can be different for each product.
See the Updating our pricing model blog post for all the details on this update.
If your site uses dynamic IDs or class names, this could mean Hotjar is unable to determine where a click occurred. For instance, a user might have clicked on this element:
<button id="button-a87dfuhd">Click!</button>
After the user interacted with the button, Hotjar reported that a click happened on button#button-a87dfuhd.
However, when Hotjar initially took the screenshot and took a copy of the HTML elements, that element may have had a different ID if the ID is generated dynamically.
<button id="button-pdfuhd8fu9">Click!</button>
When this happens, Hotjar won't be able to match the two elements. As a result, you will not be able to tell where the click took place.
How can I fix this and capture my missing clicks?
To solve this issue, add the following attribute to the element with dynamic IDs/classes or to any parent that contains such elements. The effects will trickle down to any descendants of this element:
data-hj-ignore-attributes
Example
Let's assume you have a list of the top 3 best sellers on your site. The IDs of the containers for these items change according to the item ID.
<div id="best-sellers">
<div id="item-4264">
<!-- Article title + Description -->
</div>
<div id="item-7764">
<!-- Article title + Description -->
</div>
<div id="item-3531">
<!-- Article title + Description -->
</div>
</div>
In this scenario, when Hotjar would have stored a copy of your elements, it would have stored three elements that change throughout the day, resulting in Hotjar not managing to properly match the item containers your users click on.
Adding the attribute mentioned earlier will fix the problem:
<div id="best-sellers" data-hj-ignore-attributes>
<div id="item-4264">
<!-- Article title + Description -->
</div>
<div id="item-7764">
<!-- Article title + Description -->
</div>
<div id="item-3531">
<!-- Article title + Description -->
</div>
</div>
This attribute enables Hotjar to rely on tags to track usage
By adding the 'data-hj-ignore-attributes' attribute, Hotjar will ignore any classes and/or IDs the element and all its children have.