Learn how to set up widgets to display several hotels in one block.
About the widget
This article describes the hotel widget.
Currently, several hotels (specific or matching certain criteria) can be shown in one block.
Development and setting of the widget
The widget settings include:
- Projects — select the project where the widget will be placed
- Your Sub ID — helps you understand statistics; for example, to find out how and what pages visitors went to on the widget (for details about the additional marker (Sub ID)
- Widget’s layout — two variants are possible:
- Full — big photos of the hotels
- Compact — small photos of the hotels
- Host — the website on which a hotel’s offer is opened by clicking on the Look at the hotel button. An offer will open on your website if you create and set up the White Label and select it in the domain list
- Locale — the widget language
- Currency — the currency, in which a room cost is displayed
- Hotels in the selection — the number of hotels, shown in the widget (v. infra if the Prepared selections variant is chosen)
- Add my referral link — adds a link Powered by Travelpayouts under the search form. More details in the article Referral program.
- Widget width — specify the widget width (in pixels) on a page. The width can also be changed by holding the widget corner using the left mouse button and moving it to the right or left. If the «Responsive» variant is chosen, the widget will be automatically adjusted to the user’s screen resolution
- Disable redirect to Booking.com — if it isn’t selected the hotel is opened on Booking.com by default. If the checkbox is select, the hotel page will open on the Hotellook.com
You can add hotels to the widget by pressing the By hotels button in the Filters section.
Insert a hotel name into the field. A new hotel can be added by pressing the Add button.
The autocomplete function will be activated upon entering a hotel name. It is used to search for similarities in names and to show them in the list under the field.
Press the Delete button to delete an unwanted hotel.
You can add up to 10 hotels into your own selection.
Press the By city button to display the formed selection of hotels in the widget.
The City field is given to enter the name of the city for which the selection will be shown. Choose the required selection in the drop-down list after uploading the selections. Up to three selections may be added. The users will switch over to them using the icons in the top part of the widget.
After finishing the configuration, click the Copy code and place the widget code on your website. Please note that if your site is powered by WordPress you can use our plugin to host widgets and other affiliate tools.
Life hack: how to get a collation of hotels for a city
To get a collation of hotels for a specific city, replace a city id code (in the example given
above, this id=30553) with its IATA code. For example, the final embed code for Paris shall be as follows:
<script async src=«//www.travelpayouts.com/blissey/scripts.js?iata=PAR&type=full¤cy=rub&host=search.hotellook.com&marker=77410.&limit=10» charset=«UTF-8»></script>
Upon making this modification, you will be able to add the required IATA city code into the widget code almost immediately.
Example of a Hotels Selections widget