How to add Koalendar to a Squarespace site

Easily add your Koalendar booking page to your Squarespace site. This article will walk you through the different options we have:

• Link to Koalendar with buttons or text
• Embed your Koalendar inside your Squarespace page
• Display a floating button that opens Koalendar in a pop-up

Link to Koalendar with buttons or text

1. Click Share on one of your booking pages and copy your Koalendar link

2. Sign in to your Squarespace account, go to your website and click Edit

A. Add your Koalendar link to text or an image

1. Select the text or image on your page.
2. Select Link > URL.
3. Paste your Koalendar URL.

B. Add your Koalendar link to a button

1. Hover over the content area, then click + Add Block

2. Choose Button and place it on your page.
3. Edit the button text (e.g., “Book Now”).
4. Select Link > URL, and paste your Koalendar URL.

Embed your Koalendar inside your Squarespace page

1. Click Share on one of your booking pages

2. Select Add to website

3. Choose one of our Embed options & click Copy Code

4. Sign in to your Squarespace account and click Edit

5. Hover over the content area, then click + Add Block

6. Select Code, and click the Edit icon

7. Select Mode HTML and paste your Koalendar embed code

8. Finally, adjust the size of the embed to your preferences (if you've chosen Inline Embed. For the others embed options, it doesn't matter.), and click Save to update your live site. That's it!

Display a floating button that opens Koalendar in a pop-up

1. Click Share on one of your booking pages

2. Select Add to website

3. Choose Popup Widget  & click Copy Code

4. Sign in to your Squarespace account, go to your website and select Website > Pages

5. Scroll to the bottom, and select Custom Code > Code Injection

6. Inside the Footer section, paste your Koalendar widget code, and click

7. That's it! Your button will now appear on your Squarespace site