Squarespace integration

Add a booking calendar to Squarespace

To add a booking calendar to Squarespace, copy your website code from RentalBeam and paste the script snippet into a Code Block. Guests see your open dates, synced from Airbnb, Vrbo and Booking.com. The calendar is free on every plan; the booking form (Pro) and the map (Plus or Pro) paste in the same way.

See every builder
RentalBeam availability calendar showing three months, with open dates in color and booked dates crosshatched

Availability calendar

Paste the calendar into Squarespace. Free on every plan. Use the script snippet in a Code Block.

rentalbeam.com/dashboard
A rental's Availability calendar section: a live three-month preview, its website code, and the color presets below

What you need

  • A Squarespace page you can edit
  • Your RentalBeam calendar widget
  • Connected Airbnb, Vrbo, Booking.com, or other iCal feed(s)

Steps

  1. Open the page section you want to edit
  2. Insert a Code Block
  3. Paste the RentalBeam calendar script embed code
  4. Save, publish, and confirm the calendar on the live page

Before you publish

  • Paste into a Code Block, not a Text or Markdown block, so Squarespace does not escape the code.
  • Code Blocks execute scripts on Business plans and above; on a lower plan that strips scripts, use the iframe snippet instead.
  • Check the live published page (not just the editor preview) on desktop and mobile, since Code Block scripts may not run inside the editor.

Where to put it

  • Add the calendar near pricing, inquiry, or direct-booking content instead of burying it deep in a long page.
  • Test the page inside Squarespace preview and on a live published URL.
  • Leave enough vertical space so the embed does not feel cramped inside the section.

The script snippet looks like this

html
<script src="https://cdn.rentalbeam.com/v1/embed.js" async></script>
<div class="rentalbeam-calendar" data-rental-id="your-rental-id" data-rb-reserved style="min-height: 386px;"></div>

Squarespace Code Blocks run scripts on Business plans and above, so the script embed keeps the calendar responsive and sized to your page.

Booking form

Take booking requests on Squarespace. On Pro. Guests pick dates, see the price and send a request.

rentalbeam.com/dashboard
A rental's Booking form section: the live form preview with its website code beneath

Steps

  1. Edit the booking page in Squarespace
  2. Add a Code Block where the form should live
  3. Paste the booking widget script snippet
  4. Save, publish, and submit a test request

Before you publish

  • Paste into a Code Block, not a Text or Markdown block, so the snippet is not sanitized.
  • Code Blocks execute scripts on Business plans and above; on a lower plan that strips scripts, use the iframe snippet instead.
  • Run one desktop and one phone test on the live published page, since Code Block scripts may not run in the editor preview.

Where to put it

  • Give the booking form enough horizontal space, avoid narrow side-by-side columns around the embed.
  • Publish before testing, then submit one real inquiry on desktop and one on a phone-sized screen.
  • Pricing and booking-rule changes made in RentalBeam appear automatically, the snippet never needs re-copying after the first install.

The script snippet looks like this

html
<script src="https://cdn.rentalbeam.com/v1/embed.js" async></script>
<div class="rentalbeam-booking-form" data-rental-id="your-rental-id" data-rb-reserved style="width: 100%; max-width: min(100%, 840px); margin: 0 auto; min-height: 160px;"></div>

Squarespace Code Blocks run scripts on Business plans and above, so the booking form script keeps the best loading and mobile behavior.

Map

Show where your rental is on Squarespace. On your own website with Plus or Pro. Exact pin or approximate area.

rentalbeam.com/dashboard
A rental's Map section: the styled map preview with the five theme choices

Steps

  1. Open the page section you want to edit
  2. Insert a Code Block
  3. Paste the RentalBeam map script embed code
  4. Save, publish, and confirm the map on the live page
The Address & pin card in a rental's Details: an address search field and a map with a draggable pin
Save the rental's location on its Details page first.

Before you publish

  • Paste into a Code Block, not a Text or Markdown block, so Squarespace does not escape the code.
  • Code Blocks execute scripts on Business plans and above; on a lower plan that strips scripts, use the iframe snippet instead.
  • Check the live published page (not just the editor preview) on desktop and mobile, since Code Block scripts may not run inside the editor.

Where to put it

  • Add the map near your address, directions, or nearby-attractions content instead of burying it deep in a long page.
  • Test the page inside Squarespace preview and on a live published URL.
  • Leave enough vertical space so the embed does not feel cramped inside the section.

The script snippet looks like this

html
<script src="https://cdn.rentalbeam.com/v1/embed.js" async></script>
<div class="rentalbeam-map" data-rental-id="your-rental-id"></div>

Squarespace Code Blocks run scripts on Business plans and above, so the script embed keeps the map at its chosen theme and aspect ratio; if your plan strips scripts, use the iframe snippet in the same Code Block.

Troubleshooting

If a widget does not show on Squarespace. It goes in a Code Block. Then check these, in order.

If the widget only shows after a refresh

Your template uses Ajax loading (Squarespace 7.0), which skips scripts in a Code Block when a visitor clicks through from another page. Move the line that starts with <script into Settings > Advanced > Code Injection > Header and leave the rest in the Code Block, or turn off Enable Ajax Loading under Design > Site Styles > Site: Loading.

  1. Publish the page and check the live address, not only the editor preview.
  2. Open the page in a private window to rule out a cached copy.
  3. Check that your RentalBeam calendar already shows the right booked dates before you look at the page.
  4. Send one test booking request from the live page and confirm the email reaches you.

Squarespace questions.

Can I use RentalBeam on Squarespace?

Yes. The availability calendar, the booking form and the map all paste into a Code Block on Squarespace, and they work alongside your Airbnb, Vrbo or Booking.com listings instead of replacing them.

Should I use a script or iframe on Squarespace?

Squarespace Code Blocks run scripts on Business plans and above, so the script embed keeps the calendar responsive and sized to your page. In practice, script is the best default for Squarespace.

Will this sync with Airbnb, Vrbo, and Booking.com?

Yes. RentalBeam supports any iCal URL, so you can import Airbnb, Vrbo, Booking.com, Google Calendar, and other compatible sources. The booking form reads the same calendar, so guests never see dates that are already booked elsewhere.

Do I need a property management system?

No. RentalBeam is for hosts who want synced availability and direct-booking tools without paying for a full PMS stack.

Does RentalBeam take a commission or booking fee on guest card payments?

RentalBeam Pro is a single direct-booking plan with no commission and no booking fee. It adds the booking form widget, guest-payment workflow, coupon codes, seasonal pricing, custom fields, booking rules, host email tools, and reply-from-inbox guest messaging. RentalBeam never takes a cut of your booking revenue. When a guest chooses to pay by card through RentalBeam, the only deduction is the standard Stripe card-processing fee, which is paid to Stripe - not RentalBeam. Inquiry, pay-later, and off-platform bookings (such as bank transfer) carry no per-transaction cost at all.

Which plan do I need?

The availability calendar works on every plan, including Free. The booking form needs Pro. Every plan can build and preview a map in a rental's Map section; showing it on your own website needs Plus or Pro.

Can I show an approximate area instead of my exact address?

Yes. Each rental's Details page lets you choose exact-pin mode or approximate-area mode. Approximate mode shows guests a shaded circle instead of your exact coordinates, and nearby highlights are withheld.

Put your calendar on Squarespace

Free to start. Copy the website code, paste it in, and publish.

Compare plans