Clickmaps

Overview

LogRocket provides clickmaps and heatmaps for each page of your application, accessible in two different ways. These show you the parts of your page that your users are clicking on most frequently. You can view heat maps for most clicked, most rage clicked, and most dead clicked elements.

Session Playback View

LogRocket provides clickmaps and heatmaps as part of session replay. These show you the parts of your page that your users are clicking on most frequently.

To view the click map or heat map for a specific page, you should be in the session playback part of the application. Find the page whose click map you would like to view and pause the playback. In the top-right corner, click the Heatmap tab.

From here, you can select the type of click map you would like to view by clicking on the Most Clicked Elements dropdown. LogRocket offers the ability to view click maps for most clicked elements, as well as most rage-clicked and most dead-clicked.

📘

Session data

The numbers for this data are pulled from the number of sessions within your current filter that interacted with this page, so they may not necessarily represent the entirety of visitors to your application who visited the page.

Filtering sessions

If you would like to drill into a specific click within the click map, hit the Add to filter button below the click you want to track. This will add the CSS selector to your existing filter and show sessions where the specific interaction took place.

Metrics View

You can also create a Heatmap within the Metrics tab.

In the 'Add Chart' pane, select 'Heatmap' as the Metric type and then define the URL that you want to see the heatmap for. Then, select the type of heatmap you want to see: clicks, dead clicks, rage clicks, scroll, or conversion rate.

📘

URL definition for heatmaps

You can use either "is" or "contains" for the URL definition. If you use "is", the heatmap is more likely to show you exactly the page you are interested in. Please note that you must specify "http://" or "https://" if using the "is" option because it is an exact match.

If you use "contains", there is a chance the page may not match what you had in mind.

After you define the URL and add filters as desired, click 'Save Chart'. You will be taken to the Heatmap detail view, where you'll see an overlay of the page that you selected alongside metadata about the element with the highest number of clicks. There is also a list of sessions below the heatmap, showing sessions in which a user has visited the page. This allows you to easily pair quantitative data from the heatmap alongside the qualitative data of seeing how users are actually interacting with the page.

Video walkthrough

Updated about a month ago

Clickmaps


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.