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.

Prerequisites

Required Files

Notes

StepAction
1Click hereto download zip containing the required files.Don’t have  zip software? Click here to visit CoffeeCup Software and download their Free Zip Wizard.
2Open the file horizontalCalendarConfig.html for editing (not in MS Word!)
3On line 11 replace oliveg with your own operator ID.
4On line 14 replace 2289 with your property ID.
5Optionally, on line 26 you can specify some CSS to style the layout of the form.
6On 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).
7On line 71 set the value to the full URL to your SeekomMessageAgent.html page (set up as part of the prerequisite).
8Save and Upload this file to your website, make a note of the full URL to this page.
9Include 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>
10Insert 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="http://mywebsite.com/horizontalCalendarConfig.html" width="100%" height="100px"
 scrolling="auto" frameborder="0" style="border: none; overflow-y: visible"></iframe>
11Save and publish as normal.