Responsive Booking Page: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
|||
| (11 intermediate revisions by 3 users not shown) | |||
| Line 102: | Line 102: | ||
To customise the the booking page go to {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE > LAYOUT. | To customise the the booking page go to {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE > LAYOUT. | ||
If you do not want to use multiple layouts leave the selector for "Layout" there and the selector for "Default Layout" in SETTINGS | If you do not want to use multiple layouts leave the selector for "Layout" there and the selector for "Default Layout" in {{#fas:cog}} (SETTINGS) BOOKING ENGINE and the selector set to 1. | ||
==== Change template==== | ==== Change template==== | ||
Choose the template you want to use and then click on "Restore default". | Choose the template you want to use and then click on "Restore default". | ||
| Line 135: | Line 136: | ||
*If you use the property slider or property picture and have "Style" set to "Full width" you will need to make sure the slider/pictures position is set to row 1 position 1, desktop full width and mobile full width. There should be no other module in row 1. Also make sure you deactivate all modules which you do not use. | *If you use the property slider or property picture and have "Style" set to "Full width" you will need to make sure the slider/pictures position is set to row 1 position 1, desktop full width and mobile full width. There should be no other module in row 1. Also make sure you deactivate all modules which you do not use. | ||
*If you want to show a '''Google Map''' you need to add an Google Map API Key in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE > DEVELOPER. You can obtain an API key from Google here https://developers.google.com/maps/documentation/javascript/get-api-key. Usually a free key is sufficient. Make sure you activate all required settings. | *If you want to show a '''Google Map''' you need to add an Google Map API Key in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE > DEVELOPER. You can obtain an API key from Google here https://developers.google.com/maps/documentation/javascript/get-api-key. Usually a free key is sufficient. Make sure you activate all required settings. | ||
*The "Policies" module will use display the policies you have entered in {{#fas:cog}} (SETTINGS) | *The "Policies" module will use display the policies you have entered in {{#fas:cog}} (SETTINGS) > BOOKING ENGINE A link to policies on your web site can be please wherever you can enter descriptive texts. You can set up a "custom question" (Type= Checkbox, Use=Obligatory) in {{#fas:cog}} (SETTINGS) PROPERTIES >-BOOKING QUESTIONS. If required you can add a link for example: "I accept the <a href="http://www.mywebsite.de/agb" target="_blank">terms and conditions </a>." Replace www.mywebsite.de/agb with a link to the terms and conditions on your web site. | ||
| Line 253: | Line 254: | ||
General settings which apply to all layouts like minimum/maximum number of guests, nights, type of price display etc. are in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE. | General settings which apply to all layouts like minimum/maximum number of guests, nights, type of price display etc. are in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE. | ||
=== Multiple or single room booking=== | === Multiple or single room booking=== | ||
You can allow guests to book one room or unit, multiple rooms or units | You can allow guests to book one room or unit, multiple rooms or units or give them the choice. The setting is available in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE. | ||
*If you set “Guest Can choose” it will show the selection button “Book Multiple” on top right of the Booking Strip of the booking engine. | |||
*By choosing “Enable” it will show only Check in, Check out and Nights. | |||
*By “Disable” it will show Check in, Check out, Nights and Guests. | |||
=== Allow enquiries when no price is found === | === Allow enquiries when no price is found === | ||
If you are using Fixed Prices you can set "Allow Enquiry" = yes. This will allow the guest to send an enquiry if you have availability but the system can not find a price. If you generally want to accept only "Requests" instead of confirmed bookings go to {{#fas:cog}} (SETTINGS) | If you are using Fixed Prices you can set "Allow Enquiry" = yes. This will allow the guest to send an enquiry if you have availability but the system can not find a price. If you generally want to accept only "Requests" instead of confirmed bookings go to {{#fas:cog}} (SETTINGS) BOOKING ENGINE and set your "Booking Type" = Request | ||
=== Adjust prices on your booking page by adding a multiplier === | |||
Adjust prices on the booking page. If you want to add a multiplier to your prices, add a * followed by the multiplier number. The setting is available in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE. | |||
Examples: | |||
*1.23 multiplies the price by 1.23 (i.e. raised by 23%). | |||
*0.85 reduces the price to 85% of the normal price (i.e. lowered by 15%). | |||
=== Add a logo to your page === | === Add a logo to your page === | ||
| Line 302: | Line 317: | ||
=== Add Chat === | === Add Chat === | ||
Chat systems provide a script which you can add in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE > DEVELOPER "Insert in HTML <HEAD>" to add a chat to a property booking page or {{#fas:cog}} (SETTINGS) BOOKING ENGINE > MULTI BOOKING PAGE > DEVELOPER "Insert in HTML <HEAD>" to add a chat to the the multi property booking page. | Chat systems provide a script which you can add in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE > DEVELOPER "Insert in HTML <HEAD>" to add a chat to a property booking page or {{#fas:cog}} (SETTINGS) BOOKING ENGINE > MULTI BOOKING PAGE > DEVELOPER "Insert in HTML <HEAD>" to add a chat to the the multi property booking page. | ||
==Accessability== | |||
The booking page has a basic optimisation for barrier-free access. | |||
If accessibility is important to you, you must also make sure | |||
1. that you choose colours with high contrast. The following are recommended: | |||
Body Background ? | |||
Body Background: ffffff | |||
Content Background: ffffff | |||
Content Text: 000000 | |||
Link Colour: 1a5176 | |||
Border Colour: bdbdbd | |||
Highlight Background From: ffffff | |||
Highlight Background To: ffffff | |||
Highlight Text: 000000 | |||
Form Background: ffffff | |||
Form Text: 000000 | |||
Selected Dates Background: f2f2f2 | |||
Selected Dates Text: 000000 | |||
Available Dates Background: 12852b | |||
Available Dates Text: ffffff | |||
Request Dates Background: def7e3 | |||
Request Dates Text: 000000 | |||
Not Available Dates Background: db5148 | |||
Not Available Dates Text: ffffff | |||
2. if your booking page opens as a new page/tab, or is used as a landing page for Google, you should add a property description with H1 and ideally also H2 headlines at the top. | |||
==Use multiple layouts== | ==Use multiple layouts== | ||
You can use up to 6 different layouts at the same time. | You can use up to 6 different layouts at the same time. | ||
The default layout is defined in {{#fas:cog}} (SETTINGS) BOOKING ENGINE | The default layout is defined in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PROPERTY BOOKING PAGE > LAYOUT | ||
If you want to use multiple layouts you can set the number you want to use them under before you save. To open another than the default layout add a parameter to the URL. Example: | If you want to use multiple layouts you can set the number you want to use them under before you save. To open another than the default layout add a parameter to the URL. Example: | ||
| Line 314: | Line 376: | ||
will display layout 2. If you are using Wordpress you can add a layout parameter to the shortcode as explained in the plugin settings. | will display layout 2. If you are using Wordpress you can add a layout parameter to the shortcode as explained in the plugin settings. | ||
The Facebook app uses the "default" layout which is set in SETTINGS | The Facebook app uses the "default" layout which is set in{{#fas:cog}} (SETTINGS) BOOKING ENGINE > BOOKING PAGE. | ||
== Developer options == | == Developer options == | ||
| Line 348: | Line 410: | ||
== Change from adaptive to responsive booking page== | == Change from adaptive to responsive booking page== | ||
Go to SETTINGS | Go to {{#fas:cog}} (SETTINGS) BOOKING ENGINE > BOOKING PAGE and select "Booking Page Version" = Responsive. This setting will activate Layout 1. | ||
When you change from adaptive to responsive you need to assign your pictures again. Go to {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PICTURES. Set the selector to the room then choose "Offer 1" and activate the picture/pictures you want to display. If you are using more than one offer repeat for each. | When you change from adaptive to responsive you need to assign your pictures again. Go to {{#fas:cog}} (SETTINGS) BOOKING ENGINE > PICTURES. Set the selector to the room then choose "Offer 1" and activate the picture/pictures you want to display. If you are using more than one offer repeat for each. | ||