Entwickler-Tools

Integrations-Designer

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

Konfiguration

Wird im gesamten Reservierungsformular verwendet.

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.

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.at/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
AttributTypBeschreibung
business-idstringIhre öffentliche Unternehmenskennung. Erforderlich.
localestringStartsprache: de, en, fr, it oder ru.
primary-colorstringAkzentfarbe für das gesamte Reservierungsformular.
button-colorstringFarbe 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
MethodeAufrufBeschreibung
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
OptionTypBeschreibung
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 Unter­nehmens­profil

Hinterlegen Sie Ihre Reservierungs­seite 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 Buchungs­link

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

https://reservier.at/de/demo
  1. 1Kopieren Sie den Buchungs­link oben.
  2. 2Öffnen Sie die Google-Suche für Ihr Unternehmen. Melden Sie sich als Profil­inhaber an, um die Verwaltungs­leiste zu sehen.
  3. 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 ordnungs­gemäß funktioniert. Mit Ihrer Zustimmung nutzen wir auch Analyse-Cookies, um Ihr Erlebnis zu verbessern. Daten­schutz­erklärung