Difference between revisions of "How to Add the Booking Engine Search Widget in Your Website"

From hoteliga
Jump to: navigation, search
(Introduction)
(Basic Setup)
Line 12: Line 12:
  
 
== Basic Setup ==
 
== Basic Setup ==
do this:
+
Implementing of the widget is separated into 3 parts.
<pre>here goes code</pre>
+
First is adding the following code to the part you want to implement the widget.
 +
 
 +
<pre><div class="hoteligaForm">
 +
    <label for="from">From</label>
 +
    <input type="text" id="from" name="from" />
 +
    <label for="to">to</label>
 +
    <input type="text" id="to" name="to" />
 +
    <label for="promocode">promo code</label>
 +
    <input type="text" id="promocode" name="promocode" />
 +
    <button id="searchBtn">Search</button>
 +
</div>
 +
</pre>
 +
 
 
== Advanced Setup ==
 
== Advanced Setup ==

Revision as of 17:10, 5 September 2019

Introduction

TODO: Say that we have a widget. What is a widget. What does it do. What is the advantage.


Hoteliga team provides the tools to your web developer to integrate a widget into your existing website.

A widget is a standalone area component that performs a certain function. In this case, this widget contains a search form, so guests can select dates (and room types in Advanced setup) without leaving the website.

When guests select a specific room on the hotel website for specific dates, and clicks "book now", they will be redirected to IBE and continue from this point.

With this widget searching becomes way faster.

Basic Setup

Implementing of the widget is separated into 3 parts. First is adding the following code to the part you want to implement the widget.

<div class="hoteligaForm">
    <label for="from">From</label>
    <input type="text" id="from" name="from" />
    <label for="to">to</label>
    <input type="text" id="to" name="to" />
    <label for="promocode">promo code</label>
    <input type="text" id="promocode" name="promocode" />
    <button id="searchBtn">Search</button>
</div>

Advanced Setup