Why does the Heatmap screenshot not show the fully rendered page (pictures or content missing)?

The screenshot for a Heatmap is taken when the page is officially loaded according to the browser. In some cases, the browser may consider the page fully loaded and rendered before all components are actually loaded. For example, when you lazy load certain images or other resources for a faster page load time. This means the load event triggered by the browser is not reliable and you need to manually tell Matomo (Piwik) when the site is considered loaded to see a fully rendered screenshot in the Heatmap. To do this, follow these steps:

1) Disable Heatmap & Session Recording in your tracking code (as early as possible eg when calling “setSiteId” etc):

_paq.push(['HeatmapSessionRecording::disable']);

2) Enable Heatmap & Session Recording as soon as the page is considered fully rendered within your code:

_paq.push(['HeatmapSessionRecording::enable']); 

Please note that when you manually disable the Heatmap & Session Recording, then Matomo will only start recording the session when you have re-enabled it (once the page was fully loaded). As a result, any interaction that occurred before the page was fully loaded will not be recorded. In general, we recommend to try and make your pages load faster so that your visitors have a better user experience and you do not experience this issue as much.