Skip to main content

Booking widget

Updated

Only if you subscribed to RentalReady payment system or if your Stripe account is connected to RentalReady.

 

Overview

RentalReady offers an instant booking widget you can install on your own website. This allows you to synchronize RentalReady with your website.
 
The booking widget synchronizes:
  • Rates and availabilities from the calendar
  • Property cancellation policy
  • Discount codes
  • Guest messages

 

Activate the widget

Contact RentalReady support to activate the booking widget for your RentalReady account.
The team will provide you with the platform ID that you will need to add to the code.
 

Add the widget

You will find below the steps to install the booking widget for each property.

 

Create a div

1/ Create a div guestready-booking-widget__rootwith where the booking widget should be displayed as follows:

<div id="guestready-booking-widget__root" />

2/ Add the property HTML attribute data-rental="property_ID" (replace property_ID with the property number on RentalReady).

3/ Add the platform ID HTML attribute data-reservation-platform-id="platform_ID" (replace platform_ID by the number RentalReady team provided you at activation time).

4/ Add other HTML attributes if necessary (see the list below).

5/ Change the font if necessary. Load the desired font in the page header as follows:

link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">

N.B: boking widget default font is Arial

6/ Add this element before closing the tag:

<script src="https://book.guestready.com/booking_widget/main.js"></script>

 

Possible HTML attributes

data-base-url: Confirmation  page domain name. Should not end with a slash. (example "https://pms.rentalready.io")

data-locale : Language displayed (supported languages are en, fr and pt)
data-checkin : Pre-selected check-in dates with format YYYY-MM-DD
data-checkout : Pre-selected check-out dates with format YYYY-MM-DD
data-adults : Pre-selected number of adults
data-children: Pre-selected number of children

 

Example

The booking widget to be installed on the website for property 78375 - Villa Rose should look like this:

<div id="guestready-booking-widget__root"
     data-rental="78375"
     data-locale="fr"
     data-reservation-platform-id="125"
     data-base-url="https://pms.rentalready.io"
     >
</div>
<script src="https://book.guestready.com/booking_widget/main.js"></script>

Related articles