Entwickler-Tools

Integrations-Designer

Erstellen Sie ein fertiges Code-Snippet, um das Reservierungs-Widget auf jeder Website einzubinden.

Konfiguration

Business-IDSprache

Akzentfarbe

Wird im gesamten Reservierungsformular verwendet.

Buttonfarbe

Optionale Farbe für den schwebenden Reservieren-Button. Standard ist die Akzentfarbe.

Website-Vorschau

Geben Sie Ihre Website-URL ein, um das schwebende Widget in einer sicheren Vorschau-Kopie zu sehen.

Website-URL

Vorschau

Einbettungs-Code

Fügen Sie dieses Snippet vor dem schließenden Body-Tag Ihrer Website ein. Ein schwebender Reservierungs-Button erscheint in der unteren rechten Ecke.

<reservier-widget
  business-id="demo"
  locale="de"
  primary-color="#4f46e5"
></reservier-widget>
<script src="https://reservier.net/widget/v1/widget.js"></script>

Widget-Attribute

Diese Attribute konfigurieren das Widget- und das Skript-Embed. Beim Skript-Snippet stellen Sie jedem Namen data- voran.

Widget-Attribute
Attribut	Typ	Beschreibung
business-id	string	Ihre öffentliche Unternehmenskennung. Erforderlich.
locale	string	Startsprache: de, en, fr, it oder ru.
primary-color	string	Akzentfarbe für das gesamte Reservierungsformular.
button-color	string	Farbe des schwebenden Reservieren-Buttons. Ohne Angabe verwendet der Button primary-color.

button-color gilt nur für Widget und Skript — der Iframe hat keinen schwebenden Button.

Reservier JavaScript-API

window.Reservier

Das Widget-Skript legt ein globales Reservier-Objekt an. Damit öffnen oder schließen Sie das Reservierungsformular aus eigenen Buttons, Menüs oder Anwendungscode.

Methoden

Methoden
Methode	Aufruf	Beschreibung
open(options?)	Reservier.open({ locale })	Öffnet das Reservierungsformular. Mit einem Optionsobjekt und locale setzen Sie die Sprache. Kann erneut aufgerufen werden, wenn es bereits offen ist.
close()	Reservier.close()	Schließt das Reservierungsformular.
openCoupons(options?)	Reservier.openCoupons({ locale })	Öffnet das Gutschein-Formular, wenn der Gutscheinverkauf aktiv ist. Akzeptiert dieselben Optionen wie open().

Optionen

Optionen
Option	Typ	Beschreibung
locale	string	Optionale Sprache der Oberfläche: de, en, fr, it oder ru. Ohne Angabe bleibt die aktuelle Sprache. Unbekannte Werte fallen auf eine aktivierte Sprache zurück.

Alle Methoden geben void zurück.

HTML-Attribut

Ohne JavaScript: Jedes Element mit open-widget="reservier.at" oder open-widget="reservier.net" öffnet das Formular.

<button type="button" open-widget="reservier.at">
  Jetzt reservieren
</button>

Custom Element

Wenn Sie das Tag <reservier-widget> verwenden, stehen dieselben Methoden nach dem Upgrade auch am Element selbst zur Verfügung.

const widget = document.querySelector('reservier-widget');
widget?.open({ locale: 'de' });
widget?.close();
widget?.openCoupons();

Beispiel

<button type="button" id="book-table">
  Jetzt reservieren
</button>
<script>
  document.getElementById('book-table').addEventListener('click', function () {
    window.Reservier.open({ locale: 'de' });
  });
</script>

TypeScript

interface ReservierOpenOptions {
  locale?: string;
}

interface ReservierApi {
  open: (options?: ReservierOpenOptions) => void;
  close: () => void;
  openCoupons: (options?: ReservierOpenOptions) => void;
}

declare global {
  interface Window {
    Reservier: ReservierApi;
  }
}

Hinweise

Aufrufe vor dem Mounten des Widgets werden zwischengespeichert und ausgeführt, sobald es bereit ist.
Diese API gilt für das Widget oder das Skript-Snippet — nicht für den Iframe.
Rufen Sie die Methoden bevorzugt aus einer Nutzeraktion auf, etwa einem Klick. Sofortige Aufrufe beim Laden der Seite funktionieren erst, nachdem widget.js ausgeführt wurde.
locale ist optional. Das Widget wechselt nur zu Sprachen, die für das Unternehmen aktiviert sind.

Google Unternehmensprofil

Hinterlegen Sie Ihre Reservierungsseite bei Google, damit Gäste direkt aus der Suche buchen können.

Google-Suchergebnis mit der Verwaltungsleiste und markierter Schaltfläche Buchungen — Diese Leiste erscheint, wenn Sie als Administrator nach Ihrem eigenen Unternehmen suchen.

Ihr Buchungslink

Das ist dieselbe URL wie beim Iframe. Fügen Sie sie im Feld Buchungen bei Google ein.

https://reservier.net/de/demo

1Kopieren Sie den Buchungslink oben.
2Öffnen Sie die Google-Suche für Ihr Unternehmen. Melden Sie sich als Profilinhaber an, um die Verwaltungsleiste zu sehen.
3Klicken Sie auf Buchungen (Englisch: Bookings), fügen Sie den Link ein und speichern Sie.

Ihr Unternehmen bei Google suchen

Nur sichtbar für Administratoren des Profils.

Wir verwenden essentielle Cookies, damit die Website ordnungsgemäß funktioniert. Mit Ihrer Zustimmung nutzen wir auch Analyse-Cookies, um Ihr Erlebnis zu verbessern. Datenschutzerklärung