Configuration

You can customize your widget by adding attributes to the widget container div element.

Attribute list

The table below lists all available attributes:

Attribute Required Purpose Example value
data-whitelabel-domain Yes Fetch partner white label configuration your-whitelabel-address.com
data-city-slug Yes* Fetch activities in a specific destination New York
data-coords-latitude Yes* Fetch activities near a specific latitude 45.466667
data-coords-longitude Yes* Fetch activities near a specific longitude 9.183333
data-date-from No Fetch activities available from the specified date 2022-01-01
data-date-to No Fetch activities available before the specified date 2022-01-15
data-market-prefix No Use a specific market it
data-number-of-elements No The maximum number of activities to display at a time 10
data-pass-through-params No Add query parameters to the white label or musement.com URL {"aid":"example-id-123"}
data-cid No Tag traffic with a channel ID widget_cid
data-utm-source No Tag traffic source your-site.com
data-utm-medium No Tag traffic device web-widget
data-utm-campaign No Tag traffic campaign summer-promo

* A widget must be set for a single destination, but there are multiple ways to configure it. See the Destination section for more info.

White label domain

The white label domain is required for the widget configuration. It fetches your white label configuration: activity card styles, default market, language and currency. It also handles redirections to the correct white label page when a user selects an activity in the widget.

To pass the white label domain, add the data-whitelabel-domain attribute to the widget container.

Affiliate partners who do not have their own white label domain can use a value of www.musement.com, together with their affiliate ID in the data-pass-through-params attribute.

Destination

The widget configuration must contain a specific destination to show activities in the area. There are two ways to define the location. Your configuration must contain exactly one of the following:

  • City
  • Coordinates

City

If you provide the widget with the name of city via the data-city-slug attribute, it will display activities which belong to the city in our database which best matches the attribute value.

Coordinates

Using a city name can be inaccurate. Giving the widget a set of coordinates instead allows it to display activities within 100 km of the specified location. When specifying a location via coordinates, both the data-coords-latitude and data-coords-longitude attributes are required. Omitting either attribute, or using invalid decimal values, will result in an error.

Market prefix

While the white label solution allows partners to specify translations, the market prefix determines the widget's entire market. The market determines the currency and catalog of activities to display as well as translations. You can specify the market prefix with the data-market-prefix attribute.

The market prefix is optional. Your white label's default market prefix is used whenever the attribute is absent, contains an invalid value or uses a value that has not been enabled for you.

Number of elements

The data-number-of-elements attribute affects the maximum number of activities displayed in the widget. This attribute is optional and will use a value of 3 by default when absent. It accepts values from 1 to 15.

Date range

Similar to the date filters for our white label solution, you can limit activities in the widget to those with availability between a specified date range by using the data-date-from and data-date-to attributes. These attributes must contain values in the yyyy-mm-dd format and they must be used together. It is currently not possible to use only one of the date range attributes.

Query parameters

The optional data-pass-through-params attribute allows you to add query parameters to the resulting white label URL.

The attribute value must be a serialized JSON object with key-value pairs. Parameters in the attribute which are already present in the white label configuration will be omitted in the resulting URL. Due to the nature of the serialized data, partners are encouraged to take appropriate steps to properly encode the attribute value. In the example below, the value is encased in single quotes:

Copy
Copied
data-pass-through-params=" '{"aid":"example-id-123"}' "

Affiliate partners who do not have their own white label domain must include their affiliate ID as the aid query parameter via data-pass-through-params attribute. This ID is issued at the beginning of the development process.

Tagging traffic

Just as the white label solution gives partners the option to set up deep link tracking, the widget can help you better understand its performance by tagging traffic with different tracking parameters. Currently, the widget supports the following tracking parameters:

Attribute Default value
data-utm-source The site using the widget
data-utm-medium web-widget
data-utm-campaign The coordinates and position of the clicked element on the page
data-cid widget_cid

These attributes are all optional. The widget will use the specified default values when these attributes are absent.

Copyright © TUI Musement. All rights reserved.