While running A/B tests, you can use Heatmaps in Hotjar to track the performance of page or site variations to help you make decisions. This article guides you through tracking an A/B test with Heatmaps based on whether your A/B test setup is using variations on different URLs or on the same URL.
Integrate Hotjar with an A/B testing tool
Hotjar has integrations with the A/B testing tools: Google Optimize, Omniconvert, and Optimizely. If you're using one of these tools, see one of these dedicated articles for more details on setting up and using the integration with A/B testing.
Tracking variations that use different URLs
When the URL for each variation in your A/B test is different, you can use the Heatmap URL filter to show you data for a variation.
Visit your Heatmaps page.
Select a Heatmap URL filter, then enter your control URL and click View heatmap.
Which Heatmap URL filter should I select?
It's important to keep in mind how each of the Heatmap URL filters work in relation to the URLs being used in your A/B test is set up. You can review our What Are Heatmap URL Filters article to understand how they work. We've also provided some guidance below based on how your control and variation URLs might differ.
- Path - if the path of your variant and control differ, then the URL is filter would likely work best. It will match the URL provided for the heatmap, ignoring query strings and fragments.
- Query String or Fragment - if the query string or fragment differs between the control and variant, the URL contains will refine your heatmap data to the particular query string or fragment.
In a new window, add a Heatmap URL filter for your variation and click View heatmap.
You can then compare the heatmap for your control against a variation.
Tracking variations that use the same URL
This section involves the Events filter which is available on Observe 
, 
or 
plans.
If your A/B test is set up to randomly load different content for each user visiting the same page, this can be tracked using Hotjar Events. When changes or actions occur on your site, such as the loading of a specific page variant, this occurrence can be sent to Hotjar as an Event.
Events can then be filtered in Hotjar using our session filters, enabling you to refine Heatmaps to data that matches the event.
Set up Hotjar Events for your control and variants.
Different event names should be used for A/B tests
For A/B testing purposes, ensure the event names you're using are unique to the page being tested.
You may need to consult your web developer to help implement Hotjar Events on your site as it can involve adding JavaScript to your site. Alternatively, it's also possible to implement Hotjar Events using Google Tag Manager or Segment.
After some time for data collection has passed, visit your Heatmaps page.
Enter the URL used for the A/B test and click View heatmap.
Click Add filter and select Events
Enter the event names used for your A/B test and click Apply.
The event names used for your A/B test will depend on your set up. It may be the case you sent an event only when the variant was loaded. You could then view a heatmap for the control by choosing the is none of these condition inside the Events filter and entering the variant event name. In a new window, you could view a heatmap for the same URL and this time apply the Events filter with the condition is any of these and the variant event name.
It is not possible to trigger a Heatmap screenshot based on an event
It isn't possible to trigger a specific screenshot based on an event. When applying an Event filter, Hotjar will show data collected from sessions where users triggered the event at any point during their session. However, depending on the URL used when viewing a heatmap, this doesn't always mean the screenshot you're shown will also be the page where the event fired.
To see the expected screenshot, you may need to refine the heatmap URL used to generate the heatmap by using Heatmap URL filters.