Answer · Tracking & analytics
Can Microsoft Clarity record Microsoft Bookings?
Last updated 4 min read6 sources
“Can Microsoft Clarity (or Hotjar) record sessions and heatmaps on my Microsoft Bookings page?”
Asked in Reddit (opens in a new tab)
Short answer
Only the part on your own website. Microsoft Clarity records your landing page, but its FAQ says it "captures clicks on first-party iFrames ... but not on third-party iFrames", and an embedded Bookings page is a third-party frame from outlook.office.com. You also can't install Clarity on the booking page Microsoft hosts. As of October 2026, no Clarity (or Hotjar) recording or heatmap shows the service, time or details steps of a Microsoft Bookings booking.
What Clarity sees on a page with Bookings embedded#
Clarity's documentation is clear on both points:
- Third-party frames aren't rendered. The FAQ says Clarity "can't render inside third-party 'iFrame' or 'canvas' elements".
- Third-party frames aren't clicked. On heat maps, Clarity "captures clicks on first-party iFrames (that is, iFrames source is the same domain as original page source) but not on third-party iFrames".
- Heat maps need the tracking code on the page. The click maps article says a heatmap "is only displayed on the site pages where the Clarity tracking code is installed".
So a recording of your booking page shows the visitor arriving, scrolling and reaching the frame. What they do inside it is missing. The click map shows the frame as cold, even on a day when people booked through it. Don't read that as "nobody uses the form".
And the page Microsoft hosts?#
If your button links to outlook.office.com/book/... instead of embedding it, the visitor leaves your site. Clarity's recording ends at the click. Bookings has no setting for custom scripts or a tag container, so you can't add Clarity there.
Hotjar and other tools#
The same browser rule applies to every session-recording tool. Hotjar's help centre says Heatmaps and Recordings block iframe elements by default, and its options for capturing iframe content depend on settings and code you control. You can't add code to Microsoft's page, so expect the same blank frame.
Getting the most out of Clarity anyway#
Clarity is still useful for the part of the journey you own.
-
Install it on the landing page. The quickest route is Clarity's own Google Tag Manager set-up (Settings → Setup → Google Tag Manager), or the "Microsoft Clarity - Official" template in GTM.
-
Check the scroll map. If most visitors never reach the embedded form, the problem is above it: the offer, the layout, or a frame placed too low on mobile.
-
Send an event when someone clicks Book. Clarity's client API takes
window.clarity("event", "<name>"), and the event shows up in Filters, Dashboard and Recordings. In GTM, create a Custom HTML tag fired by your Book link-click trigger:HTML <script> window.clarity && window.clarity("event", "booking_click"); </script> -
Mark the first click into the frame. The window-blur snippet in GTM and the Bookings iframe pushes
bookings_iframe_interactionto the dataLayer. Add a second Custom HTML tag on that Custom Event that callswindow.clarity("event", "bookings_started"). Now you can filter recordings to people who started the form, and to people who reached it and didn't. -
Keep more of those sessions.
window.clarity("upgrade", "booking")asks Clarity to prioritise the session for recording. That matters on busy sites, where Clarity samples recordings above 100,000 sessions a day. -
Tag the campaign.
window.clarity("set", "campaign", "<value>")adds a custom tag you can filter on.
Completed bookings still only exist in Bookings. Count them from the export or a Power Automate flow, as in the funnel drop-off guide. There's no session ID in the export, so you compare totals, not individual visits.
Doing this with BookingsXP#
BookingsXP has no Clarity integration, and its widget also runs in its own iframe, so Clarity still won't record clicks inside the widget. What changes is that each step is announced to your page. Every plan, Free included, pushes bookingsxp.widget_viewed, date_selected, slot_selected, form_started, booking_completed, no_availability and the other steps to the dataLayer. In GTM, add a Custom Event trigger on ^bookingsxp\. (tick Use regex matching) and a Custom HTML tag that calls window.clarity("event", {{Event}}). Clarity then shows which recordings reached each step and which ended on a visit with no open times. See GTM and GA4 for the event list.
The "heatmap" in BookingsXP analytics is a weekday by hour heatmap of booked appointment times, not a click or scroll heatmap. It shows when people choose to come in. The step funnel (saw the widget, picked a day, picked a time, started details, booked) is the closest thing to session insight. Both are on Pro, while Free shows headline counts for 30 days; see pricing. They only cover bookings made through the widget or hosted page. BookingsXP is independent and not affiliated with or endorsed by Microsoft.
Questions people also ask
Sources
- Microsoft Learn (opens in a new tab) · learn.microsoft.com
- Microsoft Learn: Click maps (opens in a new tab) · learn.microsoft.com
- Microsoft Learn: Clarity api (opens in a new tab) · learn.microsoft.com
- Microsoft Learn: Google tag manager (opens in a new tab) · learn.microsoft.com
- help.hotjar.com: 36820034687633 Can I Track iframes Inside Heatmaps and Recordings (opens in a new tab) · help.hotjar.com
- Microsoft Learn: Customize booking page (opens in a new tab) · learn.microsoft.com