Integrating Heatmaps Into Your Store

Today, I'm going to show you how to creep on your website visitors in order to understand what is and isn't working on your website

Whether it’s abandoned shopping carts on Shopify or a high bounce rate on your blog, this will be a tool to get to the root of it.

HotJar features the following:

  • Is free!
  • Video Recordings of Users: Videos of website visits that are anonymized
  • Interaction Heatmaps: Heatmaps of clicks on your site as well as how many in particular spots
  • Scroll Heatmaps: What percentage of your site users scroll to. Do only 30% of visitors scroll past a 1/4 of your front page?
  • Integrates with Nearly Every Website: Includes Shopify, Wordpress, Wix, Squarespace, and any website where you can edit the header HTML.

I’ll show you some examples as well derived meaning. However, if you know you’re ready,


Interaction Heatmaps

Look at that beautiful, beautiful interaction heatmap of my old porfolio. You can see people tend click on my “Let’s Talk” button most, next my email address, and thirdly the projects button.

This tells me two things:

  1. I need to put important things in the hero to get the most interactions
  2. People tend to come to my site so that they can contact me- I should make contacting me as easy as possible

Video Recordings of Users

Maybe you see users clicking on things they shouldn’t, which tells you to make those things look less clickable by muting the styling. Or maybe you have an ecommerce store, and you see a user clicking on navigation to view shoes on every page they go to and then never getting there. This would tell you to optimize your navigation to shoes.

Now let's install it!

1. Sign up for HotJar

It's totally free and doesn't require any kind of credit card info. Head over to They only ask for your name and email and they also don't spam the sh*t out of you; I personally don't remember ever receiving followup emails from them.

2. When you're going through the signup steps, it'll ask you to put in your site url. Pop that sucker in.

3. It'll then take you a page with the script you need to put on your website. Copy that to your clipboard

The page/script should look like this:

4. Go over to your website and edit the HTML. Right before the </head> tag, paste that in and save it.

Make sure your changes are saved to your live site.
If you need help, I can do it for you or with you over TeamViewer for $30. Email me your name and who your website provider is at and we'll get it done.

5. When you know it's saved to your live site, click on the "I have installed the tracking code" button to verify, then click the "Verify Installation" button

6. It should pop up a window with your website and a message in the left top corner letting you know if you're good to go

7. Now you're good to go! If you want to enable session recording go to the "Recordings" section located on the left navigation and press "Start Recording"

I hope that was at least somewhat helpful on your path to getting a better understanding of how users use your site! Also fill out the subscription form bellow if you would like to stay up to date with the articles I publish and other helpful news about Shopify and productivity.

Leave a comment

Please note, comments must be approved before they are published