Customise Booking Page

The booking page can be fully customised to individual needs.

Optional Settings

• 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 Discounts adding a Marketing Column (4)

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

• Colours and fonts / SETTINGS -> BOOKING PAGE -> PAGE DESIGN

• 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.

Advanced Design

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

Bigger Room Name

/*code for bigger room name*/

.at_roomnametext{

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

}

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); }

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; }

Booking Page with Rounded Corners

/*code for rounded corners*/ #bookingpage {

border-radius: 7px;

-webkit-border-radius: 7px;

-moz-border-radius: 7px; }