Adding 'InSite Service' to your own web site
These instructions are applicable only to those clients who already have or will be applying for 'InSite Service'. They do NOT apply to our Lite and Full Services.
You will need a basic knowledge of html programming in order to carry out this work. Bookingcheck provide a reasonably priced installation service to those who require it. We recommend you 'cut and paste' the code below into your web design software, as it needs to be an exact copy in every detail.
To add the Bookingcheck system so that it appears completely within your own web pages just follow the four steps below. When installed and loaded to your server, you should see our
demonstration calendar displayed
in your web page.
1. Display the Calendar
Note: The calendar requires a space on your page that is 900 pixels wide by 350 pixels high.
Create an iframe in your page by using this code at the place where you want the calendar to appear:-
<iframe src="" title="Availability" id="calendar" name="calendar" width="900" height="350" align="top" scrolling="no" frameborder="0"></iframe>
2. Display the booking date and period selector
Note: The booking date and period selector requires a space, on the same page as item 1, that is 600 pixels wide by 300 pixels high.
Create an iframe in your page by using this code at the place where you want the booking date and period selector to appear:-
<iframe src="" title="Booking" id="bookdates" name="bookdates" width="600" height="300" align="top" scrolling="no" frameborder="0"></iframe>
3. Add the activation coding
Cut and paste the following code to the bottom of your html code for this page, just before the </body> tag:-
<script type="text/javascript">
<!--These standard settings will produce a live version of our demonstration property into your page -->
<!--Change the values of clientID to your own Bookingcheck account number-->
<!--If you have more than one property on your Bookingcheck system, change the value of the propertyID to the one you wish to display-->
var clientID=10008;
var propertyID=1;
<!--Do not change the lines below here -->
window.frames['calendar'].location = 'http://www.bookingcheck.net/book?page=1&c='+clientID+'&p='+propertyID;
window.frames['bookdates'].location = 'http://www.bookingcheck.net/book?page=2&c='+clientID+'&p='+propertyID;
</script>
When you now view your page (after you have uploaded it to your server) you will find that our demonstration calendar is displayed in your web page.
4. Display the booking details panel
Note 1: This will need to be a different page from the page containing item 2 above.
Note 2: The booking details panel requires a space on your page that is 600 pixels wide by 800 pixels high.
The default page name for this page is bookdetails.htm and you need to create a page in your usual style, with this name, in the main directory of your web site (ie it is accessed at www.yourdomainname.com/bookdetails.htm). We are able to change this location and name if you wish; please raise a Support ticket telling us the full page address of the page you wish to use.
Create an iframe within your page by using this code at the place where you want the Booking Details panel to appear:-
<iframe src="" title="Booking Details" id="bookdetails" name="bookdetails" width="600" height="800" align="top" scrolling="no" frameborder="0"></iframe>
Cut and paste the following code to the bottom of your html code for this page, just before the </body> tag:-
<script type="text/javascript">
function getParam(){var parameters = location.search.substring(1).split("&");var temp = parameters[0].split("=");dy = unescape(temp[1]);temp = parameters[1].split("=");mnth = unescape(temp[1]);temp = parameters[2].split("=");yr = unescape(temp[1]);temp = parameters[3].split("=");nts = unescape(temp[1]);temp = parameters[4].split("=");cd = unescape(temp[1]);temp = parameters[5].split("=");c = unescape(temp[1]);temp = parameters[6].split("=");p = unescape(temp[1]); loc='http://www.bookingcheck.net/book/k/page3.php?day='+dy+'&month='+mnth+'&year='+yr+'&nights='+nts+'&cd='+cd+'&c='+c+'&p_idx='+p+'&Submit=1'; window.frames['bookdetails'].location = loc;}
getParam();
</script>
Converting the demo to your own calendar
When you have received confirmation that your own Bookingcheck ‘InSite Service’ is active, simply replace* the setting of
clientID=10008 where it appears in the activation code (step 3 above), replacing the 10008 with your own 5-digit Bookingcheck account number and, if necessary, the propertyID of the property, if you have more than one. Your account number is shown at the top of your Admin Menu page.
It will now be your calendar that shows on your site.
*be sure to retain the ';' (semi-colon) which teminates the line after the clientID and property number.
Potential issues
If your site uses a large font you may have to increase the width and/or height figures in the iframe tags.
If a guest makes an error with the booking date (such as trying to make a double booking) an error window appears.
In this circumstance, and depending on the guest’s security settings on their browser, there may be problems with
Internet Explorer not allowing a ‘click to go back’ operation. The guest will have to use their browser's own ‘Back’ button.
Availability Systems from