Customise Booking Page

The booking page can be fully customised to individual needs.

• Customise Design, Colours and fonts / SETTINGS -> BOOKING PAGE -> PAGE DESIGN

[Show Video]'

• Offer multiple languages (1) SETTINGS -> ACCOUNT -> LANGUAGES

• Add a custom top (2) (eg. for your logo) and/or bottom (3) (eg. for contact info, directions, link to your terms and conditions) / SETTINGS -> BOOKING PAGE -> PAGE DESIGN

[Show Video]'

• Show Discounts adding a Marketing Column (4)

[Show Video]'

• Add pictures and information for rooms (5) in SETTINGS -> BOOKING PAGE -> ROOMS

[Show Video]'

• Set different prices or packages for a room (5) in SETTINGS -> BOOKING PAGE -> ROOMS -> EXTRA PRICES

• Let Guests View and Cancel Bookings

• Customise Information your guest enters when booking / SETTINGS -> BOOKING PAGE -> BOOKING QUESTIONS

• Customise Confirmation Messages / SETTINGS -> BOOKING PAGE -> CONFIRMATION MESSAGES

• Order in which rooms appear on your booking page / SETTINGS-> ROOMS -> SETUP -> AVAILABILITY and set the Sell Priority for each room.

There is contextual help with each setting to assist you with the setup.

2 Change Default Text

You can exchange any of the default text on the booking page in SETTINGS -> BOOKING PAGE -> ADVANCED -> CUSTOM TEXT

3 Change CSS

Webdesigners use CSS to define the look and formatting of a website. Here a list of common adjustmens which can be done pasting the code provided below into SETTINGS -> BOOKING PAGE -> ADVANCED -> WEBDESIGNERS. Examples:

4 Bigger Room Name

/*code for bigger room name*/

.at_roomnametext{

font-size: 14px /*if you want the text even bigger use a higher number*/

}

5 Background Image

To use a background image upload it to SETTINGS -> BOOKING PAGE -> PICTURES. Replace https://www.beds24.com/pic/p0000/2049/04.jpg with the url of your uploaded picture.

/*code fo use an image as background*/

body { background-image:url(https://www.beds24.com/pic/p0000/2049/04.jpg); }

6 Shadow Arround your Booking Page

/*code for a shadow arround your booking page*/

#bookingpage {

-webkit-box-shadow:0 1px 2px rgba(0, 10, 10, 0.38);

-moz-box-shadow:0 1px 2px rgba(0, 10, 10, 0.38);

box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.1);

box-shadow: 0 1px 2px rgba(0, 10, 10, 0.38);

margin-bottom: 20px; }

7 Booking Page with Rounded Corners

/*code for rounded corners*/ #bookingpage {

border-radius: 7px;

-webkit-border-radius: 7px;

-moz-border-radius: 7px; }