Start Free Trial SmartBookings — Online Booking & Ticketing Software All Guides

How to Add SmartBookings Online Booking to Squarespace

Squarespace Integration Admin Location: Settings > Add to website (/admin/pages/Settings_Embed.aspx)

At a Glance • Key Takeaways

  • Automated Efficiency: Streamline online bookings, live availability scheduling, and customer communication without manual intervention.
  • Live Capacity & Conflict Prevention: Prevent double-booking across staff, rooms, activity sessions, or rental fleet assets in real time.
  • 0% Platform Booking Fees: SmartBookings does not charge transaction fees or take percentage cuts of your ticket sales or customer payments.

Overview: Squarespace Online Ticketing

Squarespace is renowned for sleek, modern aesthetics. Integrating SmartBookings enables visitors to reserve sessions, buy e-gift cards, and book birthday parties without sacrificing design quality.

You can implement either:

  1. Method 1: Header 'Book Now' Button (Recommended): Integrates directly into Squarespace's primary header navigation.
  2. Method 2: Squarespace Code Block (Embed iFrame): Embeds the live booking system directly inside a Squarespace page section.

Method 1: Adding a Header 'Book Now' Button to Squarespace (Recommended)

Squarespace provides a dedicated header CTA button that appears across all desktop and mobile pages.

Step A: Copy Your Booking Link

1 In SmartBookings, navigate to Settings > Add to website (Settings_Embed.aspx).

2 Copy your unique booking address (e.g. https://yourvenue.smartbookings.net/).

Step B: Enable Header Button in Squarespace

3 Log into your Squarespace website editor.

4 Hover over your site header and click Edit Site Header.

5 In the header menu settings, click Elements.

6 Toggle Button to ON.

7 Label the button "Book Tickets" or "Book Online".

8 Click the gear/settings icon next to the link field, paste your https://yourvenue.smartbookings.net/ URL, and toggle Open in New Window.

9 Click Save in the top left.

Method 2: Embedding via Squarespace Code Block (iFrame)

To display the booking form embedded directly into a Squarespace page:

1 In Squarespace, edit the target page (e.g. /book).

2 Click Add Block and choose Code (available on Business and Commerce plans).

3 Set the mode dropdown to HTML and ensure "Display Source" is unticked.

4 Paste the responsive embed code snippet:

<div style="position: relative; width: 100%; min-height: 850px; overflow: hidden;"> <iframe src="https://yourvenue.smartbookings.net/bookevent?embed=1" style="width: 100%; min-height: 850px; border: 0;" frameborder="0" allowfullscreen></iframe> </div>

5 Resize the block in Squarespace's Fluid Engine to stretch full-width.

6 Click Save & Publish.

Safe Mode Preview: Squarespace often hides live iframes while you are in edit mode for security. Click Preview or open your live site in an incognito tab to view the live booking widget.

Ideal Leisure Implementations on Squarespace

  • Adventure Golf: Pair beautiful drone photography of your mini golf course with an unmissable header button for online tee time booking.
  • Soft Play Centres: Showcase play frame galleries with clear links to toddler mornings and weekend admission slots.
  • Family Farm Parks: Promote lambing weeks and seasonal pumpkin picking with real-time capacity counters.
Try SmartBookings Free

Ready to Automate Your Bookings & Boost Revenue?

Join hundreds of leisure venues, sports clubs, clinics, and equipment hire businesses. Set up your online booking system in under 10 minutes with 0% platform booking fees.

14-Day Free Trial No Credit Card Required Free Setup & UK Support
Start Free Trial → Instant setup • Cancel anytime