Mouseflow Help & Support

Combine Several Pages in One Heatmap


You can combine several web pages into one heatmap with a simple line of JavaScript code.

How It Works

Mouseflow generates a heatmap for every unique URL path affiliated with your website (e.g. and get their own heatmap). To combine the pages into one heatmap, a Mouseflow variable is used to create a new common path that both pages will use. 

Query-String Variables

If you use query-string variables (e.g. you can control whether they make your pages unique. But if they have different URL paths, two heatmaps will be generated.

You can change the path that Mouseflow sees by adding the following line of JavaScript to your site:

// The path you specify must start with a '/'
var mouseflowPath = '/your/new/path';



The pages ‘/shop/products/product1’ and ‘/shop/products/product2’ (and all other product pages) should have one combined heatmap.

If you add the ‘mouseflowPath’ variable and set it to ‘ var mouseflowPath = ‘/shop/products/productdetail;’ on these pages, Mouseflow will treat all of these pages as one unique page and only generate one heatmap under the URL ‘/shop/products/productdetail’.

<script type="text/javascript">
var _mfq = _mfq || [];
var mouseflowPath = '/shop/products/productdetail';
(function() {
var mf = document.createElement("script"); mf.type = "text/javascript"; mf.async = true;
mf.src = "//";


Important notes:

  • The mouseflowPath variable is only used by Mouseflow. It won’t affect the URL or title of your livepage in any way.
  • If you use this technique you will no longer be able to see individual heatmaps for the pages you’ve combined
  • You must add the ‘mouseflowPath’ variable to all of the pages you want to combine
  • The mouseflowPath variable must be declared in the global scope. 


Tags: combine heatmaps change path query string

Have more questions? Submit a request


Powered by Zendesk