Popular routes widget

A top-destinations list is a very useful instrument for ticketing. It is actively used in the search form and in the form of a separate csv-file. With the help of the Top destinations widget, this list can be shown in any part of a website.

External view

To configure the widget and get its code for posting on your website, go to the Aviasales/Jetradar affiliate program, select Tools and there is the Widgets section.


The widget size can be fixed or automatically adjusted according to the screen resolution (or the space allocated for it). Select the Responsive check box to make the widget responsive.

Widget settings

The widget has the following settings:

  • Default destination — shows the city for which the top-five flights list is being formed
  • Host — specify the White Label address in this field if you wish to place the widget on the White Label and the results were opened on your website
  • Language — the language in which the results are shown (Russian and English are supported so far)
  • Currency — the currency in which the cost of tickets will be shown
  • Additional marker (Sub ID) — use this option to collect detailed statistics (for details on additional marker Sub ID)
  • Enable «Show hotels» check box — the check box Show hotels is added to the widget. If it is checked, the list of airline tickets will open in a new window, and the booking.com website with hotels for the city of destination will open in the current window
  • Add my referral link — adds a link Powered by Travelpayouts under the search form. More details in the article Referral program


Copy the code from the GET CODE block and place it on your website. The widget will then be built into your website.

How to place multiple widgets on the page

To place multiple widgets on the page in a row, use code like this (here is an example of placing three widgets):

<div style="width: 100%; float: center;">
<div style="float: left; width: 30%; margin: 5px;">
<script async src="//www.travelpayouts.com/weedle/widget.js?marker=16886&host=hydra.aviasales.ru&locale=en&currency=usd&destination=BKK&destination_name=Bangkok" charset="UTF-8"></script>
<div style="float: left; width: 30%; margin: 5px;">
<script async src="//www.travelpayouts.com/weedle/widget.js?marker=16886&host=hydra.aviasales.ru&locale=en&currency=usd&destination=LON&destination_name=London" charset="UTF-8"></script>
<div style="float: left; width: 30%; margin: 5px;">
<script async src="//www.travelpayouts.com/weedle/widget.js?marker=16886&host=hydra.aviasales.ru&locale=en&currency=usd&destination=PAR&destination_name=Paris" charset="UTF-8"></script>

In the code use the following styles:

  • width — specifies the width of the area in which widgets will occupy the unit
  • float — the widgets to each other
  • margin — padding between widgets

The result of the placement of the code would look like this:




Was this article helpful?

Have more questions? Submit a request