BookingsXP

Websites & CMS

Microsoft Bookings on Squarespace

Squarespace has its own scheduling product, but if your calendar lives in Microsoft 365 you want bookings to land in Outlook and Teams. BookingsXP lets a Squarespace page show your Microsoft Bookings availability in a widget that fits the design, while Microsoft stays the system of record.

Try it with your linkQuickstart
Integration
Squarespace
Plan: Free
Works on every plan, including Free ($0, no card).
In short
A Code block with the script and element, or Code Injection for a floating button on every page.
Microsoft Bookings
Stays your system of record. Bookings land in Outlook and Teams and Microsoft sends the invites and reminders.
Trademarks
Squarespace is a trademark of Squarespace, Inc.. BookingsXP is independent and not affiliated with or endorsed by Squarespace.

What happens with Squarespace

  • A Squarespace Code block inserts your HTML into the page itself, so the loader runs on your site's origin.
  • The loader pushes booking events to window.dataLayer on the page and calls gtag if it is present, so a Google tag added through Code Injection receives them.
  • The widget resizes itself inside the Code block; you do not need to set a height.

Set up Squarespace

4 steps. Names of menus and buttons are as they appear today; vendors rename things, so look for the closest match.

  1. Step 1: Add a Code block

    Edit the page, click an insert point or Add Block, and choose Code. Leave the display mode on HTML.

  2. Step 2: Paste the snippet

    Paste the script and element and apply. Replace the widget ID, or use booking-url with your public Bookings link.

    HTML
    <script src="https://bookingsxp.com/embed/v1.js" async></script>
<bookingsxp-widget widget="w_8fk2m1qz" theme="auto"></bookingsxp-widget>

  3. Step 3: Optional: a floating button everywhere

    Open Code Injection in your site settings and paste the script and a floating element into the Footer field. Save.

    HTML
    <script src="https://bookingsxp.com/embed/v1.js" async></script>
<bookingsxp-widget widget="w_8fk2m1qz" mode="floating" button-text="Book now" accent="#111827"></bookingsxp-widget>

  4. Step 4: Check the live page

    Squarespace disables scripts in Code blocks while you edit, so the editor shows a placeholder. Save, exit the editor and view the live page to test.

Outcomes and caveats

What you get

  • Microsoft Bookings availability inside a Squarespace page, not a link out to outlook.office.com.
  • A widget that follows your accent colour and light or dark theme.
  • Booking events on the page for GTM or GA4 added through Code Injection.

Limits and caveats

  • Squarespace allows JavaScript in Code blocks and Code Injection only on plans that include custom code. Check your plan first.
  • The widget does not run in the editor preview; test on the live page.
  • If a Code block strips the custom element, use the <div data-bookingsxp data-widget="…"></div> form instead.

Squarespace questions

Something not covered? Email hello@bookingsxp.com.

Start free, no card

One widget, four templates, GTM and GA4 events and attribution in every booking. No card, no time limit.

Start freeTry it with your link

No Microsoft sign-in or admin consent. Free plan, no card.