Integrate offers from Swiss Activities into your website
The Swiss Activities Widget is the easiest way to integrate activities into your website. Choose from a variety of widget styles and embed in minutes.
Introduction
The Swiss Activities widget is the easiest way to embed activities from Swiss Activities in your website. It is a custom HTML element that can be implemented in any HTML context. The widget is responsive and will automatically adjust to the available space that it has in the embedded website.
Setup
To get started, simply include the following script tag in the <head> section of your website:
Widget
Since the widget is a custom HTML element, it can be customized using standard attributes. The following attributes are available and can be used to adjust the widget to your needs.
- affiliate: your affiliate ID
- booking: whether the button should directly open the widget in a modal or link to Swiss Activities (default: false)
- button-background: the background color of the button (default: #ff385c)
- button-color: the color of the button text (default: #fff)
- button-text: the text of the button
- display: the display mode of the widget (widget | cta | button) / (default: widget)
- heading-text: the heading text
- ident: the ID of the activity
- language: the language of the widget (de | en | fr | it) / (default: de)
- paragraph-text: the paragraph text
Display modes
Widget
By default, the widget will be displayed in widget mode, where it fetches the current activity information like title, description and image from Swiss Activities API.
CTA
The widget can also be displayed in CTA (call to action) mode, where it will display the activity title and description or a custom heading and paragraph text.
Fixed
When in fixed display, the widget will be displayed in a fixed position at the bottom of the page.
Button
In its most basic form, the widget can also be displayed as a simple button.
Headless
If none of the options above fit your needs, you can also use the widget in headless mode, which won't render any HTML. Instead, you have to define the HTML yourself. This mode is useful if you want to link multiple activities in a text or want to use a custom template for the widget.
Getting the activity ID
The activity ID is the unique identifier of the activity in Swiss Activities. It can be found in the footer of the page when you are currently browsing an activity page.
