Prerequisites for using this feature: you must have an active b2c whitelabel set up on your Aether account If you would like to incorporate a search widget (like the one on the innstant.com homepage) for your hotel searches, you can do that easily by following these 2 simple steps: 1. create a DIV container where you would like the search widget to be created, for example: <div id="container"></div>
2. include the following code anywhere on the page (anywhere except the container div, of course): <link href="http://example.com/Widgets/InnstantSearchForm/innstant.css" rel="stylesheet" />
<script src="http://example.com/Widgets/InnstantSearchForm/innstant.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var INN_Options = {
searchUrl: "http://example.com/search/"
} $("#container").innwidget(INN_Options);
});
</script>
1. Change the domain "example.com" (highlighted above in yellow) to your b2c whitelabel domain 2. Options: | key | type | comments | | showHead | |
| | dateFormat | date format | the format in which the dates will be displayed in the input fields (default: d M y) | | hotelIds | array | collection of hotel ids (example: [256827,190347,10379] ) - if set, only these hotels will be shown in the auto-suggest field | | searchUrl | url | the base URL for the search page in your whitelabel | | showHead | boolean | should the header of the search widget be displayed | | showNoDates | boolean | should the "I don't know my dates" checkbox be displayed | | topHeadline | string | replaces the "Search. Find. Book." headline | | subHeadline | string | replaces the "Book now, pay later" string | | placeHolderText | string | replaces the "e.g. city, region, district or specific hotel" string | | defaultCheckin | date object | the default check in date. example: new Date(2014, 10, 5) for Nov 5th, 2014 (see notes). or, if you'd like to set the check in date as today + 3 days, you can use the following setup: defaultCheckin: new Date(new Date().setDate(new Date().getDate() + 3)) | | defaultCheckout | date object | the default check out date, see defaultCheckin for example | | defaultDateInterval | int | In case you do not want to specify a checkout date, you can just put the number of stay nights and the search box will do the rest | | defaultCityId | int | the default city id, removes the location search | | defaultHotelId | int | the default hotel id for the search, removes the location search | | countryCode | string | 2 letter iso code of the country you wish the auto-suggest to limit results for | | aid | string | affiliate id (freetext, not mandatory) used to keep track of affiliates | | cid | string | campaign id (freetext, not mandatory) used to keep track of campaigns |
Note: 1. all of the above settings are optional. the only mandatory setting is "searchUrl". 2. The javascript Date object uses a 0 based counter to define the months, so January is 0, February is 1, etc. 3. To change the look & feel you can simply overwrite the CSS after loading innstant.css. | 
