Browse the manual

Set up the booking widget on your website

Building and changing the booking widget on your website (Admin → Settings → Iframes): widget type, colours, search options, default dates and times, online payment, minimum booking periods, allowed pickup and return days, and the code for your web builder

15 min read

What this page covers

  • Booking, basic or display widget
  • Brand colours
  • Show locations, categories and availability
  • Default rental length and times
  • Use location opening hours
  • Rename the two date fields
  • Require payment online
  • Full or part payment
  • Minimum booking period per season
  • Allowed pickup and return days
  • Buffer before checkout
  • VAT display and locale

Introduction

Customers who book on your company's website are not using a separate system: they are using a small window of RentVisie that sits inside your website. The app calls that window an Iframe; this page calls it the booking widget. Every widget has its own settings — what it looks like, what it lets the customer choose, which rental length it suggests, whether the customer has to pay online — and its own piece of code that your web builder pastes into the website.

You manage widgets from the screen headed Iframe: a Back link, a New Iframe button and a table of your widgets by Name. Opening a widget shows a long settings screen, also headed Iframe, in pairs of blocks: CORE beside COLORS, SEARCH SETTINGS beside RESTRICT YOUR VIEWS, GENERAL beside PAYMENTS. Below those sit two small lists — minimum booking periods and allowed booking days — then the Generate Embed Url button, the Script box and Save / Cancel.

You come here when:

  • the website is new and needs a way for customers to book;
  • the widget still shows default grey and should match your brand colours;
  • customers book one-day rentals in the summer and you want a three-day minimum in July;
  • your office is closed on Sundays and nobody should be able to pick up a car then;
  • you want customers to pay the full amount, or a part of it, while they book;
  • you are just checking what your website currently offers customers.

Terms used on this screen, to look up as they come up:

The screen saysIt means
IframeA booking widget: the RentVisie window inside your website
Security keyThe widget's own number. It is part of the website code
Embed Url, ScriptThe code your web builder pastes into the website
Asset groupA vehicle class
CategoryA group of vehicle classes, such as Vans or Campers
Checkout, CheckinPickup and return
LocaleThe language code the widget opens in, such as nl or en
MollieThe payment company that takes the customer's online payment

Use this page to build or change what the website offers. For what happens to a booking once it arrives in RentVisie, see Handle bookings that come from other systems.

How to use

Configuration

Four things decide what the widget does. The first three live outside the widget's own screen.

1. Widgets must be allowed for your company. RentVisie support switches this on (the Allow iframes setting on your company record). Until it is on, every widget you build stays locked on your website. Ask RentVisie support if you are not sure.

2. Online payment needs a payment connection. A widget that asks the customer to pay takes that payment through Mollie, so your company's Mollie connection must be set up first. See Take card and online payments.

3. The names of the two date fields. The widget shows two date boxes, one for pickup and one for return. Their names are chosen company-wide:

  1. From the main menu, open Admin, then Settings, then click the Asset Settings tile.
  2. Click the Dates Settings tab.
  3. Pick a First Date Name and a Second Date Name. The choices are Start date, End date, From, To, Check in, Check out, Pickup and Dropoff.
  4. Click Save. The message "Settings has been saved successfully." confirms it. Leaving either box empty gives "Choose a first date name" or "choose a second date name".

A widget takes these two names at the moment it is created. Changing them later does not rename the date fields on widgets that already exist — see the Q&A below.

If you want the widget to offer only the times a location is open, the location's opening hours must be filled in. See Set up your locations.

4. The widget's own settings. From the main menu, open Admin, then Settings, then click the Iframes tile (a laptop icon), and open the widget with the pencil icon on its row (a new widget is made with New Iframe — see step 1 under Using the booking widget screen). The settings screen is laid out in blocks; each block is described below, top to bottom. Nothing is kept until you click Save at the bottom of the screen, except the two small lists, which save each row as soon as you click Save in its own window, and the Generate Embed Url button, which saves the whole widget.

CORE (top left). Skim this table once; you will come back to single rows:

FieldStarts asWhat it doesWhat it accepts
Security keyA number the app givesThe widget's own numberNothing; it is locked
NameEmptyYour own name for the widget, such as Website NLAny text
Iframe typeBookingWhich kind of widget this is — see the table belowBooking, Display, Booking basic
VAT default typeInclVatWhether prices are shown including or excluding value-added tax (VAT)InclVat, ExclVat
Incl vat onlyNoShows prices including VAT only. Appears only when VAT default type is InclVatYes / No
Booking typeGeneralShortlease for a widget that offers short-lease rentals; General for everything elseGeneral, Shortlease
Default country codeYour company's language, or nlThe country the widget uses by default. Not shown for Booking basicTwo letters, such as nl or de
LocaleYour company's languageThe language the widget opens in. Not shown for Booking basicA short code, such as nl or en (up to 5 characters)

Which Iframe type to choose:

OptionUse it whenWhat the customer gets
BookingYou want the full booking journeySearch by dates, pick a class, add extras, book (and pay)
Booking basicYou want a simpler booking pageA plainer booking page; the search settings and category choice below do not apply
DisplayYou only want to show your vehiclesA showcase of classes; set a category below to limit it

COLORS (top right). Type colours as hex codes without the #, as the note on screen says — ccc for grey, f5f5f5 for off-white. Primary color starts as 555, Primary tint color as f5f5f5 and Secondary color as 000. Your web builder can give you the brand codes.

SEARCH SETTINGS (left, Booking widgets only). Every switch is Yes or No:

SettingStarts asWhat it does
Booking auto searchNoStarts the search as soon as the widget opens, with the default dates
Display time slotsYesLets the customer pick a pickup and return time
Use opening hours locationNoOnly offers times when the chosen location is open. Appears only when Display time slots is Yes
Show categoriesYesShows the category selector on the search screen. Set it to No to hide it
Show locationsYesShows the location selector on the search screen. Set it to No to hide it
Buffer time pre checkout in minutes0How far ahead of "now" the earliest pickup is. Whole minutes

The screen's own example: at 08:00 with a 30-minute buffer, the earliest pickup a customer can choose is 08:30.

RESTRICT YOUR VIEWS (right). Category limits a Booking or Display widget to one category of classes; leave it empty for all. A Display widget with no category also shows an Asset group box.

GENERAL (middle left). Skim this table once:

SettingStarts asWhat it doesWhat it accepts
Show availabilityYesShows the customer whether a class is available for their datesYes / No
Show insurance option detail linesYesShows the details of each insurance optionYes / No
Default days1The rental length the widget suggestsWhole days
Default pickup hour8The suggested pickup hourWhole hours, 0 to 23
Default pickup minutes0The suggested pickup minutesWhole minutes
Default return hour7The suggested return hourWhole hours, 0 to 23
Default return minutes0The suggested return minutesWhole minutes

PAYMENTS (middle right).

SettingStarts asWhat it does
Payment required?YesThe customer pays online while booking. The next two boxes appear only when this is Yes
Payment providerMollieThe payment company. Leave it on Mollie
Payment amountFullRentHow much the customer pays — see the example under Key details
Partial payment percentage10The share of the rental the customer pays. Appears only for PartialRent

Minimum booking periods (optional, left-hand list). In the left-hand list, click New. A window headed Edit Minimum Booking Period opens with From date set to today, To date 90 days later and Minimum days at 1. Change them and click Save. Outside every period the minimum is one day. Remove a period with the bin icon on its row.

MessageWhy
"Dates cannot be empty."A date box is empty
"To date should be after from date."The dates are the wrong way round
"Days should be positive."Minimum days is 0 or less
"Period overlaps with existing period."The dates touch another period — on this or any other of your widgets

Allowed booking days (optional, right-hand list). The right-hand list sits under a note that repeats the minimum-period text; it is really the list of days a customer may pick up or return. Click New. A window headed Allowed bookig day opens (the typo is on the screen). Choose a Booking event type — Checkout for pickup, Checkin for return — and type the Day of week as a number: Sunday = 0, Monday = 1, ..., Saturday = 6. Click Save. Add one row per allowed day. The list shows them under the Dutch headings Dag vd week and Boeking actie type.

Before you start: the Settings menu, the Iframes tile and every screen on this page are for the Company admin role only. Anyone else does not see them. Every widget belongs to your own company; no other company sees it.

Using the booking widget screen

From the main menu, open Admin, then Settings, then click the Iframes tile (a laptop icon). The screen headed Iframe opens.

1. Create or open a widget. Click New Iframe above the table for a new one. To change an existing one, click its row or the pencil icon at the end of the row. The bin icon beside the pencil deletes the widget straight away — the code on your website then stops working.

Save the new widget once before you do anything else. Type a Name, click Save, then open it again with the pencil. The two small lists work reliably only on a widget that has been saved. Then fill in its settings as described under Configuration, step 4.

2. Generate the website code. Click Generate Embed Url. The code appears in the Script box. Copy all of it and send it to whoever maintains your website.

3. Click Save. The screen closes and you are back at the table.

Key details

What reaches the website when. Colours (for a Booking basic widget), Category and Locale are written into the website code itself. Change one of those and you must click Generate Embed Url again and have the new code pasted into the website. Every other setting is read by the widget each time a customer opens it, so a saved change shows on the website the next time the page is loaded.

How much the customer pays online. The Payment amount choices work on the booking's total including VAT:

Payment amountThe customer pays
FullRentThe whole rental
RentAndDepositThe whole rental plus the deposit
PartialRentPartial payment percentage of the rental

An example. A customer books a van for three days at €75 a day: €225 including VAT, with a €500 deposit. FullRent asks for €225. RentAndDeposit asks for €725. PartialRent at the default 10% asks for €22.50; at 25% it asks for €56.25. The rest stays open on the booking.

If your company uses advance payment terms (the Advance payment switch in your company's payment settings), those win: the widget's Payment amount is ignored and the customer is asked for what the booking still owes. See Take card and online payments.

VAT. Prices including VAT use your company's standard VAT rate from its financial settings; the widget has no VAT rate of its own.

Default times. With the starting values, the widget suggests pickup at 08:00 and return at 07:00 the next day.

Minimum booking periods. A period of 1 to 31 July with Minimum days 3 means a customer cannot book fewer than three days if the rental falls in July. Before 1 July and after 31 July, one day is enough again.

What to do next: after the first set-up, send the Script code to your web builder and make a test booking on the website yourself. Then check that the vehicle classes you want to sell are shown online — see Set up your vehicle classes.

Q&A

Why did the website stop taking bookings after someone removed a widget? The bin icon on the Iframe table deletes the widget at once, and the website code points at that widget's number. There is no undo. Build a new widget, click Generate Embed Url and have the new code pasted into the website.

Why do customers still see the old colours, category or language? Those three are part of the website code. Open the widget, click Generate Embed Url, and have the new Script code replace the old one on the website.

Why did my changes stay after I clicked Cancel? Generate Embed Url saves the widget as it stands. Put the old values back by hand and click Save.

Why does editing a minimum booking period always say "Period overlaps with existing period."? The check compares the period with every saved period, including its own saved version. Delete the period with the bin icon and add it again with New.

Why can't I add a period on one widget when another widget has none? The overlap check covers all your company's widgets together. Two widgets cannot have periods with overlapping dates. Change the dates, or delete the period on the other widget.

Why did I choose Stripe and payments still go through Mollie? Online payment from the widget always uses Mollie. The Payment provider choice does not change that. Set up Mollie as described in Take card and online payments.

Why does a Display widget still show every class after I picked one Asset group? Picking an Asset group on its own does not change the website code. A Display widget shows either a whole Category or everything. Put the classes you want in their own category and choose that category.

Why do the date fields on the website say "Start date" when we chose "Pickup"? A widget copies the date names from Dates Settings only when it is created. Existing widgets keep the names they had. Create a new widget, set it up the same way, generate its code and have that code placed on the website.

Why can't I find the Iframes tile? The Settings menu and its tiles are for the Company admin role only. Ask your administrator.

Why does the widget offer times when the location is closed? Use opening hours location is off, or the location has no opening hours. Switch it on (it appears once Display time slots is Yes) and fill in the hours — see Set up your locations.

Related pages: