was successfully added to your cart.

How to generate heatmaps in HumCommerce

How to generate heatmaps in HumCommerce

Heatmaps show interaction data on your website. It shows where your visitors are clicking, where they move their mouse pointer and to which section they scroll down to.

Heatmaps in HumCommerce show this data for interactions recorded on different devices – desktop, mobile, and tablets – separately.

To generate a heatmap for a web page, follow these steps:

Step 1: Go to your HumCommerce dashboard.

HumCommerce dashboard

Step 2: Click on Heatmaps from the left side panel.

You’ll see the View Heatmaps page.

View heatmaps page

If this is the first time you’re creating a heatmap, this list will be empty.

Step 3: Click on the Create New Heatmap button.

You’ll be displayed the Create New Heatmap page:

Create new heatmap page

Step 4: Fill in the following details:

  • Name: Set name of the heatmap you want to create. For example, if you’re creating a heatmap for your homepage, set the name to “Homepage”.
  • Number of page views: Select the number of page views for which HumCommerce should collect interaction data for heatmap generation.
  • Target Page: Set the target page for which you want to create the heatmap.
    • Rule: You can set conditions on when the interaction data will be recorded for generating your heatmap. You can do this by adding a –
      • URL: Set what is the URL of your target page.
      • Path: Set what is the path that a visitor takes on your website for which heatmap is being generated.
      • Parameter: Set the URL parameter which must be present in the page URL for HumCommerce to record interaction data for heatmap.

Step 5: Set Advanced Options:

  • Sample Rate: HumCommerce lets you record interaction data for 100% visitor sessions. Set your desired sampling rate from this drop down list.
  • Excluded Elements: If you want to exclude a few elements from your heatmap, you can do so using CSS selectors. Add the CSS selectors you want to exclude separated by comma. For example, a pop up message that appears on your homepage but not to be included in the heatmap.
  • Screenshot URL: Your heatmap is generated with interaction data illustrated on a screenshot of your target page. If you have multiple pages that match your target page rule, you can set a screenshot URL which will be used to generate heatmap.
  • Breakpoint Mobile: Leave this to default – 600px.
  • Breakpoint Tablet: Leave this to default – 960px.

Step 6: Click on the Create New Heatmap button.

You’ll see the following confirmation message:

Heatmap created successfully

HumCommerce will now start collecting data and your heatmap will start showing up after 24 hours of heatmap creation.

If you want to see how your visitors are using your website, you can record visitor sessions using the HumCommerce tool.

Follow our tutorial to learn how to use the session recordings feature in HumCommerce.