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:
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.