Difference between revisions of "Adaptive Booking Page (Depreciated)"
Line 4: | Line 4: | ||
== LAYOUT - general layout == | == LAYOUT - general layout == | ||
− | SETTINGS -> | + | SETTINGS -> BBOOKING ENGINE -> BOOKING PAGE ->LAYOUT |
[[File:example.jpg]] | [[File:example.jpg]] | ||
Line 11: | Line 11: | ||
== Customise Design, Colours and fonts == | == Customise Design, Colours and fonts == | ||
− | SETTINGS -> BOOKING | + | SETTINGS ->BOOKING ENGINE -> BOOKING PAGE ->STYLE |
[[File:bookingpage1.png]] | [[File:bookingpage1.png]] | ||
Line 18: | Line 18: | ||
== Content == | == Content == | ||
− | *Add pictures and information for rooms (5) in SETTINGS -> BOOKING | + | *Add pictures and information for rooms (5) in SETTINGS -> BOOKING ENGINE -> BOOKING PAGE -> CONTENT. To show pictures you need to upload them first in SETTINGS -> BOOKING ENGINE -> PICTURES |
− | *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 | + | *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 ENGINE -> BOOKING PAGE -> CONTENT |
*Show [[Discounts]] adding a [[Discounts|Marketing Column]] (4) | *Show [[Discounts]] adding a [[Discounts|Marketing Column]] (4) | ||
Line 30: | Line 30: | ||
*Customise Information your guest enters when booking / SETTINGS -> PROPERTIES -> BOOKING QUESTIONS | *Customise Information your guest enters when booking / SETTINGS -> PROPERTIES -> BOOKING QUESTIONS | ||
*Customise Confirmation Messages / SETTINGS -> PROPERTIES -> CONFIRMATION MESSAGES | *Customise Confirmation Messages / SETTINGS -> PROPERTIES -> CONFIRMATION MESSAGES | ||
− | *Set order in which rooms appear on your booking page / SETTINGS-> ROOMS -> SETUP " | + | *Set order in which rooms appear on your booking page / SETTINGS-> ROOMS -> SETUP "Availability" and set the ''Sell Priority'' for each room. |
*[[Let Guests View and Cancel Bookings]] | *[[Let Guests View and Cancel Bookings]] | ||
*Developers please also refer [[developers|here]] | *Developers please also refer [[developers|here]] | ||
Line 36: | Line 36: | ||
== Change Default Text== | == Change Default Text== | ||
− | 1. You can exchange any of the default text on the booking page in SETTINGS -> BOOKING | + | 1. You can exchange any of the default text on the booking page in SETTINGS -> BOOKING ENGINE -> DEVELOPERS -> "Custom Text" |
Line 58: | Line 58: | ||
== Hide "Book Multiple" == | == Hide "Book Multiple" == | ||
− | Use the selector in SETTINGS-> BOOKING | + | Use the selector in SETTINGS-> BOOKING ENGINE -> BOOKING PAGE->LAYOUT |
== Hover Text == | == Hover Text == | ||
− | *To not show the number or rooms/units left place the following code in the SETTINGS->BOOKING | + | *To not show the number or rooms/units left place the following code in the SETTINGS->BOOKING ENGINE-> DEVELOPERS "Custom CSS" setting. |
.ptdaynumavail {display:none;} | .ptdaynumavail {display:none;} | ||
− | *To disable the hover text place the following script in the SETTINGS->BOOKING | + | *To disable the hover text place the following script in the SETTINGS->BOOKING ENGINE-> DEVELOPERS "Advanced HTML Settings" setting. |
<pre> | <pre> | ||
Line 81: | Line 81: | ||
== Change CS' == | == Change CS' == | ||
− | 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 | + | 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 ENGINE -> DEVELOPERS. |
Revision as of 19:23, 23 January 2020
This page explains how to customise the booking page
Contents
1 LAYOUT - general layout
SETTINGS -> BBOOKING ENGINE -> BOOKING PAGE ->LAYOUT
You can choose to display either a Room Availability Calendar or define a number of Price Columns.
2 Customise Design, Colours and fonts
SETTINGS ->BOOKING ENGINE -> BOOKING PAGE ->STYLE
[Show Video]'
3 Content
- Add pictures and information for rooms (5) in SETTINGS -> BOOKING ENGINE -> BOOKING PAGE -> CONTENT. To show pictures you need to upload them first in SETTINGS -> BOOKING ENGINE -> PICTURES
- 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 ENGINE -> BOOKING PAGE -> CONTENT
- Show Discounts adding a Marketing Column (4)
There is contextual help with each setting to assist you with the setup.
4 Further and Advanced Options
- Offer multiple languages (1) SETTINGS -> ACCOUNT -> LANGUAGES
- Customise Information your guest enters when booking / SETTINGS -> PROPERTIES -> BOOKING QUESTIONS
- Customise Confirmation Messages / SETTINGS -> PROPERTIES -> CONFIRMATION MESSAGES
- Set order in which rooms appear on your booking page / SETTINGS-> ROOMS -> SETUP "Availability" and set the Sell Priority for each room.
- Let Guests View and Cancel Bookings
- Developers please also refer here
5 Change Default Text
1. You can exchange any of the default text on the booking page in SETTINGS -> BOOKING ENGINE -> DEVELOPERS -> "Custom Text"
2. Stripe and Paymill insert their button and can not be changed. To change the text of any of the other payment buttons you can place this code snippet into SETTINGS -> DEVELOPERS -> "Advanced HTML Settings".
Custom Instruction: <script type="text/javascript"> $(document).ready(function() { $("#buttoncustominstruction").val("the new text"); }); </script>
Authorize.Net: <script type="text/javascript"> $(document).ready(function() { $("#buttonauthorizenet").val("the new text"); }); </script>
Paypal <script type="text/javascript"> $(document).ready(function() { $("#buttonpaypal").val("the new text"); }); </script>
6 Hide "Book Multiple"
Use the selector in SETTINGS-> BOOKING ENGINE -> BOOKING PAGE->LAYOUT
7 Hover Text
- To not show the number or rooms/units left place the following code in the SETTINGS->BOOKING ENGINE-> DEVELOPERS "Custom CSS" setting.
.ptdaynumavail {display:none;}
- To disable the hover text place the following script in the SETTINGS->BOOKING ENGINE-> DEVELOPERS "Advanced HTML Settings" setting.
<script> $(document).ready(function() { var $title = $("td,div,span"); $.each($title, function(index, value) { $(this).tooltip({ disabled:true }); }); }); </script>
8 Change CS'
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 ENGINE -> DEVELOPERS.