How to Use the Heatmap.com Screenshot System

The biggest issue of other heatmapping software is that screenshots quickly get out of date and don’t give historical heatmaps to help you understand your website over time. This is difficult to keep up with manual screenshots, creates additional work, and becomes very burdensome for your marketing and analytics teams. Heatmap.com has now solved this problem for all of our users and will save you time while giving more accurate data.

There are 3 methods of changing the screenshots you see on the Screenshots tab of the software, each with a different purpose for what you need on your screenshots. The three functions are:

1. Update Screenshot
2. Conditional Screenshots
3. Net-New Screenshots

Update Screenshot Function

It is recommended to Update Screenshot when a “minor code change” is made on your website to keep your screenshots up to date. The Update Function refreshes your current screenshot to include your new code changes. This will not create a new screenshot, but modify the existing screenshot.

Examples of “minor code changes” are:

• Replacing an image
• Text-only code changes
• Back-end changes that do not change the front-end appearance of the website

To use the Update Screenshot function, follow these steps:

Step 1: Click the dropdown to see All Screenshots of the page you want to analyze here:

Step 2: Select Take A Screenshot in the dropdown

Step 3: Use Update Current Screenshot and follow the instructions on both Mobile and Desktop

Conditional Screenshot Function

The current screenshot you see is the “Resting State” screenshot, meaning the appearance of the page that the user sees before clicking & interacting with your website. Conditional Screenshots are used to display elements that are not in the Resting State of your website.

Examples of uses for the Conditional Screenshot Function:

• Opening Menu/Navigation on your website
• Seeing additional images inside of sliders
• Different images inside of your Product Gallery
• Opening Dropdowns such as Product Descriptions or FAQs

To use the Conditional Screenshot function, follow these steps:

Step 1: Click the dropdown to see All Screenshots of the page you want to analyze here:

Step 2: Select Take A Screenshot in the dropdown

Step 3: Select Conditional Screenshot and follow the instructions on both Mobile and Desktop. When you’re choosing the options, click the Prepare Screenshot function and there will be a 20-second countdown timer. Make sure your menu or slider is open and shows the element you want to see when the countdown is complete.

Net-New Screenshots

Net-New Screenshots are a large innovation by Heatmap.com that allows you to have a record of your website over time. Net-New Screenshots create entirely new screenshots after major code changes are detected on your website.

Net-New Screenshots will store & save your existing screenshots and start a new screenshot from zero sessions to get 100% accurate data on each element after major code changes.

Please note, your previous data will not be lost, it is stored in the Screenshots Dropdown just below the screenshot you are currently viewing. It shows the date range of your website for a timeline and impact of the changes you make on your website. This makes it very easy to analyze the increase in revenue on your website driven by your website changes.

To use the Net-New Screenshot function, follow these steps:

Step 1: Click the dropdown to see All Screenshots of the page you want to analyze here:

Step 2: Select Take A Screenshot in the dropdown

Step 3: Select Net-New Screenshot and follow the instructions on both Mobile and Desktop. After you replace your old screenshot with the new one, it will start from zero sessions. All past data and screenshots are available in the Screenshot Dropdown you clicked in the first step.

These are the three major functions for updating screenshots to always see your live website accurately, make proper analysis of the data, and never worry about inaccurate data from website changes.

If you have any questions reach out to Support@Heatmap.com. For faster responses time from the Technical Support Team, we offer 1:1 Slack Channels so you can speak directly with Tier 1 Technical Support and Customer Service with very quick response times.