Je kunt de Mews Booking Engine instellen met meerdere ondernemingen en de voorgeselecteerde stad/locatie instellen.

Let op: accommodaties met alleen een Enterprise abonnement kunnen de Mews Booking Engine instellen met meerdere ondernemingen.  
In dit artikel leer je meer over:

• De vereisten
• De code
• De Booking Engine instellen  
  • Stap 1: Installeer de script-loader voor de Mews Booking Engine
  • Stap 2: Voeg knoppen toe voor het openen van de Mews Booking Engine met een specifieke voorgeselecteerde stad
  • Stap 3: Initialiseer het Mews Booking Engine widget
    • Stel de configuratie-ID's van je Mews Booking Engine in
    • Bereid de stads-ID's voor

 

De vereisten

Zorg ervoor dat je aan alle vereisten voldoet. Als je dit niet doet, kan de code voor use cases moeilijk te begrijpen zijn of kan het gedrag van de code verschillen.
 

De code 

Opmerkingen met nummers hebben meer details onder de code. Let op: Deze handleiding is alleen voor de productie-omgeving. Als je deze code in een andere omgeving wilt testen, bekijk de handleiding voor het testen in een demo/staging/test-omgeving.

De code gebruikt een voorbeeldscenario met drie hotels, een in Parijs en twee vanaf dezelfde locatie in Londen.

<DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <!-- 1. Install Distributor loader script as close to the opening <head/> tag as possible -->
        <script src="https://api.mews.com/distributor/distributor.min.js"></script>;
        <title>My page</title>
    </head>
    <body>
        <!-- 2. Knoppen toevoegen voor het openen van Distributeur met specifieke locatie voorgeselecteerd -->
        <button disabled type="button" id="london-button">Loading...</button>
        <button disabled type="button" id="paris-button">Laden...</button>

        <script>
            // 3. Initialiseer Distributor Widget net voor de afsluitende tag </body> .
            Mews.Distributor(
                // 3.1 Configuratie identiteitsdocumenten van je Distributeur instellen.
                {
                    configurationIds: [
                        'Configuratie id van eerste Londen hotel',
                        'Configuratie id van tweede Londen hotel.',
                        'Paris hotel configuration id',
                    ],
                },
                // Callback toevoegen waardoor de knoppen Distributor Widget openen en de stad/locatie wordt ingesteld.
                functie (api) {
                    const initializeButton = (buttonId, cityId, buttonText) => {
                        const buttonElement = document.getElementById(buttonId);

                        buttonElement.addEventListener('klik', event => {
                            event.preventDefault();

                            // Gebruik Distributor Widget API om de stad/locatie in te stellen en de Distributor Widget te openen.
                            api.setCity(cityId);
                            api.open();
                        });

                        buttonElement.innerHTML = buttonText;
                        buttonElement.disabled = false;
                    };

                    // 3.2 De identiteitsdocumenten van de steden voorbereiden.
                    const londonCityId = 'Je Londense stadsid';
                    const parisCityId = 'Je Parijse stadsid';

                    initializeButton('london-button', londonCityId, 'Londense hotels');
                    initializeButton('paris-button', parisCityId, 'Parijs hotel');
                }. // 4. Deze handleiding is voor productieomgevingen.
            );
        </script>
    </body>
</html>

De Booking Engine instellen 

Stap 1: Installeer het loader-script van de Mews Booking Engine

Voeg knoppen toe voor het openen van de Mews Booking Engine met een specifieke voorgeselecteerde stad

Stap 3: Initialiseer de Mews Booking Engine-widget

1. Stel de configuratie-ID's van je Mews Booking Engine in

2. Bereid de stads-ID's voor

• Als je niet zeker weer waar je de stads-ID kunt vinden, bekijk 'where to get city id' voor meer details.
• Als je meerdere hotels in dezelfde stad/locatie hebt, is de stads-ID voor allemaal hetzelfde. Gebruik daarom de eerste die je vindt.

Deze handleiding is alleen voor de productieomgeving. Als je deze code in een andere omgeving wilt testen, bekijk dan de handleiding voor het testen in een demo-, staging- of testomgeving.

De Mews Booking Engine Widget API ondersteunt meer dan alleen het voorselecteren van stad/locatie en het openen. Bekijk de andere Mews Booking Engine Widget API opties om andere opties te vinden die je zou kunnen gebruiken.

Je kunt ook andere use cases hier bekijken.