Mouseflow supports session playback of single page websites/single page applications (SPA) out of the box. Additionally, Mouseflow supports other websites that use AJAX to render new pages instead of traditional page navigation.
If new pages are loaded without reloading the DOM, there are a couple of extra steps you need to take in order for Mouseflow's functionality to work.
You can enable to Mouseflow app 'Single Page App' found under 'Settings' > 'Apps & Integrations':
How It Works
- Able to view the same content as the user in playback
- Able to analyze the different virtual pages with heatmaps and link analytics
- Able to use funnels
- Able to use forms
How to configure SPA manually
If the Mouseflow Single Page App integration doesn't work for your website, then you can apply your own custom code along side the Mouseflow script.
First, you need to ensure the window._mfq object is available:
window._mfq = window._mfq || ;
If window._mfq is available then you can simply push an update to Mouseflow whenever a new virtual page is loaded:
// When a new virtual page is rendered window._mfq.push(["newPageView", "/this-is-the-url-shown-in-mouseflow"]);
NB. If you are using React then you should take a look at this article.