Accommodation Horizontal Date Selector Booking Widget (launch to iframe)

click image to zoom

click image to zoom

Below are instructions to insert a single property horizontal date selector booking widget and launch the booking screen in in an iframe (set to dynamically resize to booking screen height).

Click here to view a working demo.


Required Files


Step Action
1 Click hereto download zip containing the required files.Don’t have  zip software? Click here to visit CoffeeCup Software and download their Free Zip Wizard.
2 Open the file horizontalCalendarConfig.html for editing (not in MS Word!)
3 On line 11 replace oliveg with your own operator ID.
4 On line 14 replace 2289 with your property ID.
5 Optionally, on line 26 you can specify some CSS to style the layout of the form.
6 On line 55 replace http://abchotel.com/file2.html with your full link to your file 1 file (your booking page set up as part of the prerequisite).
7 On line 71 set the value to the full URL to your SeekomMessageAgent.html page (set up as part of the prerequisite).
8 Save and Upload this file to your website, make a note of the full URL to this page.
9 Include the SeekomBookingLoad.js script on the page of your file 1 (ie. between <head> and </head> tags). Replace path/to/folderwith the actual folder the file can be found in (or none if the file is in your web root). 

<script language="javascript" src="path/to/folder/SeekomBookingLoad.js"></script>
10 Insert the following iFrame code in your file 1. Replace the URL with your address to your config file (from step 8). 

<iframe id="horizontalCalendarBooking" name="" onload="SeekomFrame.SetHeight(this)" src="https://mywebsite.com/horizontalCalendarConfig.html" width="100%" height="100px"
 scrolling="auto" frameborder="0" style="border: none; overflow-y: visible"></iframe>
11 Save and publish as normal.