Deutsch
English
Español
Français
NederlandsHinweis: Nur Unterkünfte mit der Abonnementstufe Enterprise können den Mews Booking Engine mit mehreren Unternehmen einrichten.
In diesem Artikel erfahren Sie mehr über:
- Die Grundvoraussetzungen
- Der Code
- #set-up-booking-engine
#Pre-requisites
Stellen Sie sicher, dass Sie alle erforderlichen Voraussetzungen erfüllen. Wenn Sie das nicht tun, kann der Code für die Anwendungsfälle schwer zu verstehen sein oder der Code kann sich anders als erwartet darstellen.Der Code
Kommentare mit Nummern enthalten weitere Details unterhalb des Codes. Hinweis: Diese Anleitung bezieht sich auf die Produktionsumgebung. Wenn Sie diesen Code in einer anderen Umgebung testen möchten, lesen Sie bitte die Anleitung zum Testen in der Demo-/Testumgebung.Der Code verwendet ein Beispielszenario mit drei Hotels, eines in Paris und zwei davon vom gleichen Standort in London.
<!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. Hinzufügen von Schaltflächen zum Öffnen von Verteilern mit vorgewähltem Standort -->
<button disabled type="button" id="london-button">Loading...</button>
<button disabled type="button" id="paris-button">Loading...</button>
<script>
// 3. Initialisiere das Verteiler-Widget kurz vor dem schließenden </body> Kennzeichen.
Mews.Distributor(
// 3.1 Konfiguriere die Ausweise deines Distributors.
{
configurationIds: [
'Ausweis für die Konfiguration des ersten Londoner Hotels',
'Ausweis für die Konfiguration des zweiten Londoner Hotels.',
'Ausweis des Pariser Hotels',
],
},
// Füge einen Callback hinzu, der die Schaltflächen zum Öffnen des Verteiler-Widgets und zum Einstellen der Stadt/des Ortes öffnet.
function (api) {
const initializeButton = (buttonId, cityId, buttonText) => {
const buttonElement = document.getElementById(buttonId);
buttonElement.addEventListener('click', event => {
event.preventDefault();
// Verwende die Acquirer Widget API, um die Stadt/den Ort zu setzen und das Distributor Widget zu öffnen.
api.setCity(cityId);
api.open();
});
buttonElement.innerHTML = buttonText;
buttonElement.disabled = false;
};
// 3.2 Bereite die Ausweise für die Städte vor.
const londonCityId = 'Ausweis deiner Stadt London';
const parisCityId = 'Ausweis deiner Stadt Paris';
initializeButton('london-button', londonCityId, 'Londoner Hotels');
initializeButton('paris-button', parisCityId, 'Pariser Hotel');
}
// 4. Diese Anleitung ist für die Produktionsumgebung gedacht.
);
</script>
</body>
</html>
Einrichten des Buchungssystems
Schritt 1: Installieren Sie das Loader-Skript für den Mews Booking Engine
Weitere Einzelheiten finden Sie im Abschnitt „Erste Schritte" zur Installation des Loader-Skripts.
Schritt 2: Fügen Sie Buttons zum Öffnen des Mews Booking Engine mit einer bestimmten Stadt als Voreinstellung hinzu
Die Tasten sind beim Laden der Seite deaktiviert, so dass Benutzer nicht auf die Tasten klicken können, bis das Widget für den Mews Booking Engine einsatzbereit ist. Wir aktivieren es später, wenn es fertig ist.
Schritt 3: Initialisierung des Widgets für den Mews Booking Engine
Wenn Sie nicht sicher sind, wo Sie die IDs für die Konfiguration finden können, lesen Sie bitte unter Woher bekomme ich die ID für die Konfiguration (where can I get configuration ID).
Auch wenn die API in der Benutzeroberfläche Standort genannt wird, benötigt sie eine ID für die Stadt.
- Wenn Sie nicht sicher sind, wo Sie die Stadtnummer finden, lesen Sie bitte unter Woher bekomme ich die Stadtnummer.
- Wenn Sie mehrere Hotels aus derselben Stadt/demselben Ort haben, ist die Stadtnummer in allen die gleiche. Verwenden Sie also die erste, die Sie finden.
Diese Anleitung ist für die Produktionsumgebung gedacht. Wenn Sie diesen Code in einer anderen Umgebung testen möchten, lesen Sie bitte die Anleitung für das Testen in der Demo-/Taging-/Testing-Umgebung.
Die Widget-API des Mews Booking Engine unterstützt mehr als nur die Vorauswahl einer Stadt/eines Ortes und deren Öffnung. Sehen Sie sich die anderen Optionen für die Widget-API des Mews Booking Engine an, um weitere Optionen zu finden, die Sie verwenden können.
Sie können sich auch einige andere Anwendungsfälle hier ansehen.