Kristen Williams Marc Maessen John Janowski Jules Webb ★★★★★ Rated 4.9/5 · 620+ Reviews

How to embed Microsoft Bookings on your Squarespace website for FREE?

Streamline appointments with our Microsoft Bookings widget, enabling visitors to easily schedule meetings and services directly on your website with just a few clicks.

Create your widget
Free forever plan No credit card Cancel any time
How to embed Microsoft Bookings on your Squarespace website for FREE?
Photo of Mike Dalisay
Mike Dalisay
Co-founder of SociableKIT · Helping small businesses since 2011
August 1, 2026 5 min read Ask ChatGPT
Quick answer

Your Microsoft Bookings on Squarespace website — live in 3 steps

SociableKIT syncs your microsoft bookings automatically. Set up once, embed anywhere — free to start, no coding required.

  1. Create in 60 seconds

    Pick Microsoft Bookings in the dashboard and connect your source.

  2. Match your brand

    Colors, fonts, layout — tune it until it feels native to your site.

  3. Paste one line of code

    Drop the embed snippet on your Squarespace website. No dev team needed.

Create your widget
  • Free forever plan
  • No credit card
  • Cancel any time
Full walkthrough

Embed Microsoft Bookings with SociableKIT — step by step

Create your widget in the dashboard, copy the embed code, and paste it on your Squarespace website. Screenshots included so you never get stuck.

Complete Guide

Follow our complete guide below to embed Microsoft Bookings on your Squarespace website for free. The guide is divided into two parts to make it easier to follow.

Create and customize your Microsoft Bookings widget

The first part is creating your Microsoft Bookings widget using the SociableKIT dashboard. Customize the look and feel to match your brand. Follow the steps below.

  1. Sign up FREE or login to SociableKIT. You can login here if you already have an account. Once you sign up, you will start your 7-day premium trial. After 7 days, you can activate the free plan if you don't need our premium features. Sign up to SociableKIT - How to embed Microsoft Bookings on your Squarespace website for FREE?
  2. Select "Microsoft Bookings" on the dropdown. SociableKIT offers several social media feeds widgets. You might need to search it using the highlighted area below. Once found, you can then select it.Select "Microsoft Bookings" on the dropdown - How to embed Microsoft Bookings on your Squarespace website for FREE?


  3. Customize your feed. Click the "NEXT" button to show the customization options of your social feed. You can change the layout, colors, font, and more to match your brand. Click the Save changes button.Customize your feed - How to embed Microsoft Bookings on your Squarespace website for FREE?
  4. Copy the embed code. Click the "Embed on website" button on the upper right corner. Select your website builder. On the popup, copy the JavaScript embed code.Copy the embed code. - How to embed Microsoft Bookings on your Squarespace website for FREE?
  5. Paste the embed code and save your Squarespace website page. Please follow the second part below to add Microsoft Bookings widget to your Squarespace website .

Add Microsoft Bookings widget to your Squarespace website

The second part is adding your Microsoft Bookings widget to your Squarespace website . After you customize your Microsoft Bookings widget and copied the embed code, it is time to add it to your Squarespace website . Follow the steps below.

  1. Copy your free Microsoft Bookings widget embed code. Make sure you followed the first part above. It detailed how to you can create and customize your widget to get your free embed code.
  2. Login to Squarespace. You must have a "Business" account in Squarespace to use the widget. The "code block" needed cannot be found if you only have a "Personal" account.
  3. Create a new blank page or edit your existing page. Identify which page you want the widget to appear. You can create a new page on Squarespace, or you can edit your existing page where you want the widget to appear.
  4. Add a Code Block. On your Squarespace page, click the 'Edit' button. Find the 'Code' block and click it.
  5. Paste the embed code from SociableKIT. On the 'Content' of the 'Code' block, paste the JavaScript embed code you have copied from your widget.
  6. Save the changes on the 'Code block'. After pasting your widget's embed code. Click the 'Save' button on the left part of the page.
  7. View your page. Refresh your Squarespace page and check your SociableKIT widget. Done!

Website builders

Paste your embed code on any platform

SociableKIT works with every major website builder. Pick yours below for copy-paste instructions tailored to that platform.

To embed Microsoft Bookings on your Squarespace site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Login to Squarespace. You must have a "Business" account in Squarespace to use the widget. The "code block" needed cannot be found if you only have a "Personal" account.
  4. Create a new blank page or edit your existing page. Identify which page you want the widget to appear. You can create a new page on Squarespace, or you can edit your existing page where you want the widget to appear.
  5. Add a Code Block. On your Squarespace page, click the 'Edit' button. Find the 'Code' block and click it.
  6. Paste the embed code from SociableKIT. On the 'Content' of the 'Code' block, paste the JavaScript embed code you have copied from your widget.
  7. Save the changes on the 'Code block'. After pasting your widget's embed code. Click the 'Save' button on the left part of the page.
  8. View your page. Refresh your Squarespace page and check your SociableKIT widget. Done!
Full Squarespace tutorial →

To embed Microsoft Bookings on your WordPress site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Login to your WordPress site. 
  4. On your WordPress, go to the "Pages" section then click the "Add new page".
  5. Pick a pre-defined layout or start with a blank page by clicking the "Blank page" button.
  6. On the body of your page, click the "+" icon and click the "Custom HTML".
  7. Paste the code in the text area and click update.
  8. The widget will appear on the WordPress page.
  9. Click the Publish or Update button on your WordPress page. 
  10. Click the view page. Done!
Full WordPress tutorial →

To embed Microsoft Bookings on your Wix site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Login to Wix. 
  4. On your existing website click the "+" button beside the "Main pages" section.
  5. Then click the "Add page" button.
  6. Name your page then hit enter.
  7. On the left, click "Add element". Find and click "Embed code". Click and drag "Embed a site" on your page then resize the container. 
  8. Click "Change website address". 
  9. Paste the link you copied from SociableKIT then click "Apply".
  10. Click "Publish" on the upper right. 
  11. Click "View site". Done!
Full Wix tutorial →

To embed Microsoft Bookings on your Webflow site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Login to Webflow. 
  4. On your existing website, click the "Page: ...." in the upper left corner then click the "Create new page" icon.
  5. Once done add a name for your new page then click "Save".
  6. On the left, click "Add Element". Drag "Embed" to your page. 
  7. Paste the JavaScript code you copied from SociableKIT.
  8. On the upper right, click "Publish" > "Publish to Selected Domains". 
  9. View your page. Done!
Full Webflow tutorial →

To embed Microsoft Bookings on your Shopify site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Login to Shopify. 
  4. On the left side, click Online Store. 
  5. Click Pages. Add a new page or edit your existing page.
  6. On the Page details, click Show HTML icon (<>). 
  7. Paste the embed code and click the Save button.
  8. Click the View page button. Done!
Full Shopify tutorial →

To embed Microsoft Bookings on your HTML site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Open your HTML file.
  4. You can create a new HTML page or edit your existing HTML page.
  5. Paste the Javascript code you copied from SociableKIT. Paste it where you want the widget to appear.
  6. Save your HTML page.
  7. You may now upload your HTML page to your web hosting.
Full HTML tutorial →

To embed Microsoft Bookings on your Google Sites site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Login to Google sites. You must have at least a 'Business Starter' plan to create and customize your Google sites.
  4. Create or edit an existing website. Click the + 'Blank' button on the 'Start a new site' section to create or find your existing website under the 'Recent sites' section.
  5. Create a new blank page or edit your existing page. Identify which page you want the widget to appear. On the right sidebar, you will see an 'Embed' button. Click the 'Embed' button. 
  6. Add the widget. A popup 'Embed from the web' will open up. Select the 'Embed code' tab on the popup. 
  7. Paste the embed code from SociableKIT. On the 'Embed code' tab, you will see 'HTML code goes here' text. Paste the embed code from your SociableKIT widget.
  8. Save the widget. Once you have pasted your embed code, click the 'Next' button. 
  9. Preview of your SociableKIT widget. After clicking the Next button, a preview of your embed code will be displayed. Click the 'Insert' button to insert the widget to your Google sites page. 
  10. Edit the widget. Once the widget has been inserted, you will have the option to resize the widget. After resizing the widget to your preferences, click the 'Publish' button on the upper right corner of the page. 
  11. Publish your page. After publishing the site, click the down 'Arrow' button beside the 'Publish' button. 
  12. View your page. A dropdown of buttons will be displayed, click the 'View published site' button. Done!
Full Google Sites tutorial →

To embed Microsoft Bookings on your Weebly site, follow the steps below after you have your SociableKIT embed code.

  1. Sign up free to SociableKIT and create your Microsoft Bookings widget.
  2. Customize your widget and copy the embed code from the dashboard.
  3. Log in to Weebly. 
  4. On your existing website on Weebly, click the "Pages" section on the upper left then click the "+".
  5. Select what type of page you want to add.
  6. Add a name to your page and then click "Done".
  7. On the top menu, click "Build" then on the sidebar, drag the "Embed Code" option on your page. 
  8. Click the "Click to set custom HTML" then click "Edit Custom HTML". 
  9. Paste the code you copied from SociableKIT then in the upper right corner, click the “Publish” button. 
  10. Click the link to your site. Done!
Full Weebly tutorial →

Live preview

Pick a Microsoft Bookings template — see it live

Choose a starting design on the left and watch the preview update with real data. What you see is exactly what visitors get on your Squarespace website.

Widget previewCalendar
Live data

Select a template to start with

Continue with this template

Common questions

Frequently asked questions

Everything you need to know about embedding Microsoft Bookings on your Squarespace website.

What is a Microsoft Bookings widget?

A Microsoft Bookings widget places your appointment booking experience directly on your website. It lets visitors view services and available times in one convenient place instead of contacting your team to arrange every appointment.

How do I embed Microsoft Bookings on my website without coding?

Create the widget in SociableKIT, connect your Microsoft Bookings source, customize the design, and copy the generated embed code. Paste the code into an HTML, custom code, iframe, or embed block on your website.

Can visitors book an appointment without leaving my website?

Yes, visitors can use the embedded booking page to choose an available service, staff member, date, and time from your website. Microsoft Bookings manages the final appointment and confirmation process behind the widget.

What do I need to connect my Microsoft Bookings page?

You need a published Microsoft Bookings page that is available to the customers you want to serve. Follow the SociableKIT source setup, then confirm that the correct business name, services, staff, and available times appear before embedding it.

Do I need a Microsoft 365 account to use the widget?

You need access to Microsoft Bookings through a supported Microsoft 365 setup to create and manage the booking page. Website visitors normally do not need an account unless you restrict the page to people in your organization.

Will availability changes appear on my website automatically?

The embedded booking experience uses the availability configured in Microsoft Bookings, so you do not need to rebuild the website section whenever schedules change. Paid SociableKIT plans also include automatic source syncing, while the free plan provides manual sync requests.

Can Microsoft Bookings help prevent double bookings?

Microsoft Bookings can match service availability with staff calendars and existing Outlook commitments when the settings are configured correctly. This helps avoid offering times when the assigned person is already busy.

Can I offer multiple services with different durations and availability?

Yes, Microsoft Bookings lets you create services with their own names, descriptions, durations, locations, staff, and schedules. You can also make a service unavailable temporarily or apply special hours for selected date ranges.

Can I add buffer time and control how far ahead customers book?

Yes, Microsoft Bookings lets you set preparation or travel time before and after appointments. You can also control minimum notice, maximum advance booking, time increments, and cancellation limits.

Can customers choose a staff member, or can one be assigned automatically?

You can let customers select a specific staff member when that choice suits your service. You can also hide staff selection and let Microsoft Bookings assign an available person based on the schedules you configured.

Will customers see my personal Outlook calendar?

No, customers see only the booking services, staff options, and available time slots you publish. Your private calendar details and the titles of your other appointments are not displayed on the booking page.

Can I restrict who is allowed to book?

Yes, a booking page can be open to the public or limited to people who sign in with an account from your organization. Choose the access setting that fits public appointments, employee scheduling, or internal services.

Can Microsoft Bookings create online meetings?

Yes, an eligible service can create a unique Microsoft Teams meeting link for each appointment. The link can be included in the calendar event and confirmation message so staff and customers know where to join.

Are confirmation emails, reminders, cancellations, and rescheduling supported?

Yes, Microsoft Bookings can send confirmation and reminder emails based on the service settings. Customers can also receive options to manage, cancel, or reschedule appointments when those controls are enabled.

Can I ask custom questions or collect consent during booking?

Yes, you can add optional or required questions for each service, including contact details, notes, or information needed before the appointment. Microsoft Bookings also supports a custom consent message for organizations that need customers to acknowledge data-use terms.

How does the widget handle different time zones?

Microsoft Bookings has separate time-zone settings for the business calendar and the customer-facing booking page. Customers can see appointments in their local time zone unless you choose to always display the business time zone.

Can I accept group or class bookings?

Yes, Microsoft Bookings supports services where several customers reserve the same appointment time. Set the maximum number of attendees for classes, workshops, tours, consultations, or other shared sessions.

Can customers pay through the Microsoft Bookings widget?

Microsoft Bookings does not provide native payment processing for appointments. SociableKIT embeds the booking experience but does not add a checkout, so payment instructions or a separate approved payment workflow may be needed.

Where are bookings and customer details managed?

Appointments, customer details, staff assignments, and service settings remain managed in Microsoft Bookings rather than inside SociableKIT. SociableKIT Business analytics can help measure widget activity, but confirmed appointment records should be reviewed in Microsoft Bookings.

Is the widget customizable, mobile friendly, and available on a free plan?

Yes, SociableKIT lets you adjust colors, fonts, layout, and calls to action, and the widget works across major website builders and screen sizes. The free plan includes one source, one widget, one domain, and up to 2,000 monthly views, while paid plans add automatic syncing, unlimited widgets and views, and 24/7 human support.

Add your Microsoft Bookings widget today

Set up in minutes. Free forever to start.

Create your widget

Free forever · No credit card · Cancel anytime

Just need a free widget? See our free plan → View Microsoft Bookings widget page →