Carrd integration
Add a booking calendar to Carrd
To add a booking calendar to Carrd, copy your website code from RentalBeam and paste the script snippet into an Embed 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.
Availability calendar
Paste the calendar into Carrd. Free on every plan. Use the script snippet in an Embed element.
What you need
- A Carrd site on Pro Standard or higher
- Your RentalBeam calendar widget
- At least one connected OTA or iCal availability source such as Airbnb or Vrbo
Steps
- Open your site in the Carrd builder
- Add an Embed element where guests should check dates
- Set Type to Code and Style to Inline, then paste the RentalBeam calendar script snippet
- Publish the site and check the live page, because embeds do not show in the builder
Before you publish
- Embeds need Carrd Pro Standard or higher. On a free site the Embed element is not available.
- Paste the snippet exactly as RentalBeam gives it to you. Carrd warns that a mistake in embedded code can leave the published page blank.
- Embeds show only on the published site, so a blank space in the builder is normal.
Where to put it
- Add the Embed element right under the section that describes the rental, so guests see the dates while they are deciding.
- Set Style to Inline so the calendar sits exactly where the element is.
- Publish to check the result. Carrd does not show embeds inside the builder.
The script snippet looks like this
<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>Carrd's Embed element with Type set to Code places the snippet straight into the page, so the script embed keeps the calendar sized to its content.
Booking form
Take booking requests on Carrd. On Pro. Guests pick dates, see the price and send a request.
Steps
- Open the page where guests should send booking requests
- Add an Embed element at that spot
- Set Type to Code and Style to Inline, then paste the RentalBeam booking widget script snippet
- Publish, then send a test inquiry from the live page on a computer and a phone
Before you publish
- Embeds need Carrd Pro Standard or higher.
- Put the form right below your calendar so guests can check dates and book in one place.
- Send one real test inquiry from the published page 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.
- Set Style to Inline so the form sits exactly where the element is.
- Send your test inquiry from the published page, since Carrd does not show embeds inside the builder.
The script snippet looks like this
<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 Code embed sits in the page itself, so the booking form script can grow as guests fill it in.
Map
Show where your rental is on Carrd. On your own website with Plus or Pro. Exact pin or approximate area.
Steps
- Open the page where guests should see your rental's location
- Add an Embed element at that spot
- Set Type to Code and Style to Inline, then paste the RentalBeam map script snippet
- Publish and check the map on the live page
Before you publish
- Embeds need Carrd Pro Standard or higher.
- Place the map near your address or directions so guests find it naturally.
- Embeds show only on the published site, so check there after every change.
The script snippet looks like this
<script src="https://cdn.rentalbeam.com/v1/embed.js" async></script>
<div class="rentalbeam-map" data-rental-id="your-rental-id"></div>The Code embed sits in the page itself, so the map script keeps the theme and aspect ratio you chose in the Map section.
Troubleshooting
If a widget does not show on Carrd. It goes in an Embed element. Then check these, in order.
- Publish the page and check the live address, not only the editor preview.
- Open the page in a private window to rule out a cached copy.
- Check that your RentalBeam calendar already shows the right booked dates before you look at the page.
- Send one test booking request from the live page and confirm the email reaches you.
Related guides. The same widgets, in more depth.
Carrd questions.
Can I use RentalBeam on Carrd?
Yes. The availability calendar, the booking form and the map all paste into an Embed element on Carrd, and they work alongside your Airbnb, Vrbo or Booking.com listings instead of replacing them.
Should I use a script or iframe on Carrd?
Carrd's Embed element with Type set to Code places the snippet straight into the page, so the script embed keeps the calendar sized to its content. In practice, script is the best default for Carrd.
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 Carrd
Free to start. Copy the website code, paste it in, and publish.