Our Multi-Vertical Search Widget utilizes all the features of Flight Search, Hotel Search and Car Hire Search Widgets in one place. It provides a configurable tab system with aforementioned widgets inside.

NB: For best presentation on your landing page, ensure that the widget is in a container with a width of at least 300px if you don’t use Multi-city mode, or at least 500px for Multi-city mode. Otherwise you may experience styling issues.

Important note: If you are using a Content Secure Policy Header to control resources on your website, please make sure you allow the following URLs: www.skyscanner.net, widgets.skyscanner.net, js.skyscnr.com, css.skyscnr.com.

Associate ID and Tracking

If you have a direct partnership with Skyscanner, you will have to add your associate ID to the HTML snippet to ensure your exits are tracked. To do so, add data-associate-id="ABC_DEF_12345_56789" to the HTML snippet as shown below.

If you do not know your associate ID, you can obtain it from your account manager.

Widget Options

For customization, Multi-Vertical Search Widget accepts all attributes, that are acceptable for all built-in sub-widgets. For detailed information about options of sub-widgets please go to the following pages:

Flight Search

Hotel Search

Car Hire Search

skyscannerWidget

required

data-skyscanner-widget="MultiVerticalWidget"

Defines the widget type.

Show details

MultiVerticalWidget

locale
data-locale="ru-RU"

Sets widget language.

You can use one of
"bg-BG", "ca-ES", "cs-CZ", "da-DK", "de-DE", "el-GR", "en-GB", "en-GG", "en-US", "es-ES", "es-MX", "fi-FI", "fr-BE", "fr-CH", "fr-FR", "hr-HR", "hu-HU", "id-ID", "it-CH", "it-IT", "ja-JP", "ko-KR", "ms-MY", "nb-NO", "nl-BE", "nl-NL", "pl-PL", "pt-BR", "pt-PT", "ro-RO", "ru-RU", "sk-SK", "sv-SE", "th-TH", "tl-PH", "tr-TR", "uk-UA", "vi-VN", "zh-CN", "zh-HK", "zh-SG", "zh-TW"

(Note: the "locale" value is case-sensitive)

Four letter locale code

"en-GB"

market
data-market="AU"

Sets the target Skyscanner domain.

(Note: this will impact flights shown based on local market restrictions and inventory)

Two letter country code

"UK"

currency
data-currency="USD"

Sets the currency to display upon redirect to Skyscanner search results

Three letter currency code

"GBP"

associateId

optional

data-associate-id="ABC_DEF_12345_56789"

Allows for tracking of widget exits.

You can obtain your associate ID from your account manager or by contacting us.

Affiliate ID string

"WIG_WBT_01426_00001"

verticals

optional

data-verticals="hotels,cars"

Sets available vertical tabs as comma separated string of values: flights, hotels, cars.

Show details

List of flights, hotels, cars

All verticals

verticalsDefaultTab

optional

data-verticals-default-tab="cars"

Sets initially opened search tab.

Show details

One of "flights", "hotels", "cars"

The first visible tab

colour

optional

data-colour="solar"

Changes background colour of the widget.

Show details

Preset color name or hex code

transparent

fontColour

optional

data-font-colour="#000"

Changes font colour of the widget.

Show details

Preset color name or hex code

Autocalculated to contrast the background

buttonColour

optional

data-button-colour="dawn"

Changes background colour of the search button.

Show details

Preset color name or hex code

Blue

buttonFontColour

optional

data-button-font-colour="#fff"

Changes font colour of the search button.

Show details

Preset color name or hex code

Autocalculated to contrast the background of search button

widgetPadding

optional

data-widget-padding="10px 12px"

Sets padding margins of the whole widget.

Show details

A number in pixels or a value of CSS "padding" rule

0

widgetBorderRadius

optional

data-widget-border-radius="4"

Sets border rounding radius of the whole widget

Show details

A number in pixels or a value of CSS "border-radius" rule

0

widgetScale

optional

data-widget-scale="1.3"

Scales the whole widget.
The value sets, how many times the widget must be as big as original size.

Float number

1

utmTerm

optional

data-utm-term="blog"

An additional alphanumeric tracking parameter that's reported in Impact as SubId2.

Alphanumeric value with a maximum length of 255

zIndex

optional

data-z-index="100"
The z-index of the widget container.

Number

500

webOnlyRedirects

optional

data-web-only-redirects="true"

Determines if travellers are redirected to the Skyscanner app. Setting it to true will prevent the initial redirect from opening the Skyscanner app.

true / false

false

Widget Builder

Here you can play around with parameters of widgets and construct Multi-Vertical Search Widget of your preference using the side panel on the left. There are many of them, make sure you find the right one for you!