CSS files are missing
The most common reason for your recordings and heatmaps to be missing styles is that Mouseflow is unable to find the stylesheets on your server.
Mouseflow works by storing the HTML and user behavior, but it does not store the styles or images used on your website. CSS and image files are loaded from your server during recording playback, and if these files are no longer available, then your recordings will not appear as expected.
CSS files often become unavailable because their filename has changed. In most cases, your website platform will rename the CSS files every time you publish changes to the website. Recordings made before this change are still referencing the old filenames, and therefore no styles will be loaded.
To resolve this issue, you should either keep the old stylesheets on your server or redirect requests from
*.mouseflow.com to a stable version.
CSS blocked by CORS
CSS files may also be unavailable because your web server blocks them from being loaded by Mouseflow's domain. In this case, you must add
*.mouseflow.com to your Cross-origin resource sharing (CORS) policy.
You can learn more about CORS policies here
CSS requires authentication
Your web server may require authentication in order to load the CSS files. This happens most often on websites that require their visitors to log in. In the same way that the visitor must log in to view certain pages, they must also be logged in to load the CSS to their browser. You can work around this by logging in to your website in a separate browser tab, then viewing the Mouseflow recordings.