Customise Booking Page

From Beds24 Wiki
Revision as of 16:28, 24 July 2013 by Annette (talk | contribs)
Jump to navigation Jump to search


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]'


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


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

Change Default Text

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


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:

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