Specials Widget

Accommodation: Testhotel Webseitentool HGV (hotelhgv.it) (9002)

Installation

Create a widget instance by embedding the following code within your webpage inside the <body /> tag:

<div id="Bs-SpecialsWidget"></div>
<script id="booking-suedtirol-js" src="https://widget.bookingsuedtirol.com/v2/bundle.js" defer></script>
<script>
    document
    .querySelector("#booking-suedtirol-js")
    .addEventListener("load", function() {
        BookingSüdtirol.Widgets.Specials("#Bs-SpecialsWidget", {
            accommodationId: 9002,
            lang: 'de'
        });
    });
</script>

Please note: Do not include the script in a bundle or host a copy of it yourself.


Configuration

Use BookingSüdtirol.Widgets.Specials(domElement, settings) to create new widget instances.

Method arguments

domElement: string | DOM element

The CSS selector or DOM element where your widget will be mounted.

settings: object

Initialization options. See API below. Each widget instance can have it's own settings.

URL parameters

The following list of settings can also be passed over the URL.

  • accommodationId
  • lang

Notice that URL parameters always overwrite widget instance settings.


API

accommodationId: number

ID of the accommodation

Mandatory field. The accommodation must already have been activated for the widget.

lang: string?

Language

  • de: German (default)
  • it: Italian
  • en: English
  • fr: French

layout: string?

Determines the widget layout

  • layout-1 (default)
  • layout-2
  • layout-3
  • layout-4
  • layout-5
  • layout-6

maxColumns: number?

The maximum of specials displayed in a row. If the columns don't fit in the parent container, they get automatically adjusted to a lower value. Some layouts may only support a lower number than indicated.

  • 1
  • 2
  • 3
  • 4 (Default)

displayType: string?

Choose between different display types

  • tiles (Default)
  • slides

ids: number[]?

Enables you to display and order specific specials via their ID.

ID Special name
263125 Wander-Wellness-Woche
1942598 Nicht ohne meinen besten Freund
1942603 Weiße Wochen

showFromPrice: boolean?

Enables you to show or hide from prices.

  • true (Default)
  • false

Tracking

The widget supports the tracking of events and transactions using Google Tag Manager.

Please note: Google Analytics tracking without Google Tag Manager is not supported and must be implemented separately!

Google Analytics events

As the user interacts with the widget, events are generated in the background for all possible interactions. These are stored in the global dataLayer variable, which the Google Tag Manager can read and process.

The following events are supported:

Category Action Label Value
HGV-Specialwidget Special geöffnet Special name Special ID

You can view them in your Google Analytics account under Behavior, Events.