Skip to content
home
Heatmaps for Shopify

Shopify heatmaps with the numbers on.

Each section of your Shopify homepage coloured by how it did, with its number and its sessions.

Inside your Shopify admin. Sample store, sample week.
Typical first screen ends · 9% didn’t view Shop by category
Hero slideshow
Views92%3,772 of 4,100 sessions with it on the page
Clicks per 100 views21.3
Dead clicks9
Orders after a last click37within 7 days
Slides
Slide 1 3,772 viewed · 9 orders
Slide 2 851 viewed · 6 orders
Slide 3 641 viewed · 22 orders
Sample store · Mobile · 7 days · 4,100 sessionsUnder 300 sessions a device: counts only

Two kinds of heatmap

The map above is the second kind, as it looks inside your Shopify admin. There is no recording to watch: click any block to see all four of its numbers.

A click or scroll heatmap Dots where people clicked and bands for how far they scrolled, over one picture of the page. You read it by eye, and it shows where people click and how far they get.
A heatmap by section Each section of your homepage is one block, with its number and the sessions behind it printed on it. You can compare two sections in numbers and see which come before orders.

Reading the map

One measure at a time Pick Views, Clicks, Dead clicks or Orders. Each block takes its shade from its own number, set against the other sections of the page.
A count until 300 sessions A section is judged on the sessions that had it on the page. Under 300, it shows a count in a paler shade, so a few dozen visits never look like the best or worst block.
Where the first screen ends A line marks where the typical first screen ends, with the share of sessions that did not view the section below it.

Questions

Are there separate maps for mobile and desktop?

Yes. Switch between Mobile and Desktop and the map redraws your homepage with that device’s numbers, at the screen size most of your visitors use. Each device marks where the typical first screen ends and how many sessions did not view the next section. Tablets count with desktop. A phone often shows less of the homepage before any scrolling, so the two maps can tell different stories. The first screen on phones

How does Store Decode name each section?

By the name you give it first: Explore has a Rename sections button. Without one, a section takes its first heading, such as Shop by category. A section with no heading takes its type in plain words, such as Image with text, and failing that its position on the page. Your theme needs no tagging, because Shopify already marks every section and Store Decode finds each one itself. How sections are found and named

What happens on the map when a visitor declines cookies?

If your store’s cookie banner reports the visitor’s choice to Shopify, Store Decode’s script waits for it, and records nothing for a visitor who declines analytics. That visitor is not on the map. Where Shopify reports analytics allowed, the visit is measured as usual. Each block counts only the sessions it was allowed to see, and prints that count beside its number. What Store Decode collects

See your store, section by section.

Install free on the Shopify App Store (opens in a new tab)Two steps, no code Free for a limited time
Install free on the Shopify App Store (opens in a new tab)