Overlay heatmap

Note：If your page doesn't show correctly with overlay heatmap, we recommend to use Ptengine Chrome extension.

Usage #

Overlay heatmap allows you to view heatmaps as if you were looking at the page on your own website.
You can also open the overlay heatmap URL on a smartphone, you can feel how users interact with your content with smartphone.

Overlay heatmap has another important use:
You can use overlay heatmap when you don't see heatmaps correctly within the product. Examples include pages that involve user interaction, such as the post-login page of a page that requires a login, or the page in the middle of a form step.
Also, with the exception of comparison heatmaps and historical heatmaps, it is recommended to check heatmaps directly using the overlay heatmap, since you can now change device, date range, segment or heatmap type within the overlay heatmap.

How to open overlay heatmap #

Clicking on "View heatmap in new tab" icon at the heatmap list or "full screen" button in the heatmap toolbar within product, the overlay heatmap will be opened from a new browser tab. The URL is followed by Ptengine parameters, and if the measurement code has been successfully installed on the page, you can see the heatmap on your page.

How to use overlay heatmap #

The heatmap toolbar is shown at the top of this image. Below is an introduction and a detailed explanation of it.

• 1Basic data metrics
  The clicks, PVs and visits will be shown, and detailed metrics for the page can also be viewed by click on "details" button.
• 2Change date range, device type and heatmap type
  The user can quickly change the date range, device type and heatmap type directly from the top right.
• 3Show the non-interactive elements and color adjustment bars
  You can select show or hide the non-interactive elements from the "Display" button. The color adjustment bar also allows you to adjust the shade of the heatmap color.
• 4Segment
  Segmentation allows you to choose from 7 types of segment conditions, which can be useful for deep analysis. You can now use segments in the overlay heatmap as well.
  For example, if you want to see a heatmap of users who have converted on your site, you can segment users who have reavh a certain conversion in the heatmap and check their user behavior.
• 5Other
  Refresh heatmap: If the heatmap is not shown well, please click the Refresh button to refresh the heatmap.
  Interactive mode：The interactive mode allows you to interact with your page. Use this to display hidden elements that are not visible, such as menus or dropdown lists.
  Share: Click to copy the share link and send to someone who you want to share with. Users who are not in your porject can also view the heatmap, but not allowed to change date range, device type and segment conditions.
• 6Hide the toolbar
  You can hide the toolbar if you want to view the heatmap more clearly. To display the toolbar again, click on the icon again.