By default, Hotjar's Recordings do not show parts of your site that are contained inside iframes. Your iframes must first be configured to display in Hotjar by adding a HTML attribute to them and whitelisting their domain in your site settings.
Current technological limitations with tracking iframes
If you'd like to record interactions happening inside of an iframe, put the Hotjar Tracking Code on the iframe source page and not on the page where the <iframe> element is being added. Having the Hotjar Tracking Code on both the source page and the page containing the iframe can cause Recordings of the page to fail and data collection to be skewed.
Displaying iframes inside your Recordings
Until you have enabled iframes inside your Recordings, the iframe content will be shown as a black box with a message telling you that the content is not available in your Recording, as seen below.
Enabling iframes to display inside your Recordings is a two-step process.
Add data-hj-allow-iframe as an HTML attribute to the iframe.
You can do this by adding an HTML attribute, data-hj-allow-iframe, to the iframe you wish to display.
<iframe src="/page.html" data-hj-allow-iframe=""></iframe>
Whitelist the iframe's domain in the site’s Hotjar settings panel.
You can find your site settings by clicking Settings > Sites & Organizations and clicking on the cog icon next to the site you want to whitelist.
You will see a field where you can insert the domain name you wish to whitelist, under the heading Whitelisted Iframe Domains For Recordings.
An iframe source page will reload each time it's displayed in a Recording playback
The URL that the iframe points to is stored on our servers and reloaded every time a recording is played in the Hotjar dashboard. This means that if loading the iframe source page triggers some additional behavior on the server that the URL points to, other than just serving the iframe content, this could cause unexpected and adverse results.