Webador integration

Add a booking calendar to Webador

To add a booking calendar to Webador, copy your website code from RentalBeam and paste the script snippet into an Embed Code element. 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 Webador. Free on every plan. Use the script snippet in an Embed Code element.

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 Webador site you can edit
  • Your RentalBeam calendar widget
  • At least one connected OTA or iCal availability source such as Airbnb or Vrbo

Steps

  1. Open the Editor for the page where guests should check dates
  2. Drag the Embed Code element from the left menu onto the page
  3. Click the element, click Edit embed, paste the RentalBeam calendar script snippet into the input field, and click Save
  4. Open your live site and check the calendar there

Before you publish

  • The editor shows a placeholder instead of the embedded code. That is normal; check your live site.
  • If the calendar does not appear on the live site, paste the iframe snippet into the same element instead.

Where to put it

  • Add the Embed Code element right below the part of the page that describes the rental, so guests see the dates while they are deciding.
  • The editor shows a placeholder instead of the calendar. Check your live site.
  • If the calendar does not appear on the live site, paste the iframe snippet into the same element instead.

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>

Webador's Embed Code element is where widgets from other services go, so the script snippet goes straight in and keeps the calendar sized to its content.

Booking form

Take booking requests on Webador. 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. Open the Editor for the page where guests should send booking requests
  2. Drag the Embed Code element from the left menu onto the page
  3. Click the element, click Edit embed, paste the RentalBeam booking widget script snippet into the input field, and click Save
  4. Open your live site and send a test inquiry on a computer and a phone

Before you publish

  • The editor shows a placeholder instead of the embedded code. That is normal; check your live site.
  • If the form does not appear on the live site, paste the iframe snippet into the same element instead.
  • Send one real test inquiry from the published site to confirm the email reaches you.

Where to put it

  • Put the form right below your calendar so guests can check dates and book in one place.
  • The editor shows a placeholder, so judge the form on your live site.
  • Send your test inquiry from the live site, on a computer and on a phone.

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>

The Embed Code element runs the booking form script on your live site, so the form can grow as guests fill it in.

Map

Show where your rental is on Webador. 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 Editor for the page where guests should see your rental's location
  2. Drag the Embed Code element from the left menu onto the page
  3. Click the element, click Edit embed, paste the RentalBeam map script snippet into the input field, and click Save
  4. Open your live site and check the map there
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

  • The editor shows a placeholder instead of the embedded code. That is normal; check your live site.
  • Place the map near your address or directions so guests find it naturally.

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>

The Embed Code element runs the map script on your live site, so the map keeps the theme and aspect ratio you chose in the Map section.

Troubleshooting

If a widget does not show on Webador. It goes in an Embed Code element. Then check these, in order.

  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.

Webador questions.

Can I use RentalBeam on Webador?

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

Should I use a script or iframe on Webador?

Webador's Embed Code element is where widgets from other services go, so the script snippet goes straight in and keeps the calendar sized to its content. In practice, script is the best default for Webador.

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 Webador

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

Compare plans