Verwenden Sie die Buchungs-Widget von Lodgify auf einer externen Webseite

Sie können das Lodgify Buchungs-Widget verwenden, um die Buchungs-Engine von Lodgify auf einer externen Webseite zu integrieren. Dafür bieten wir mehrere Optionen: eine “Suchen” -box und eine “Buchen” -box.

Die “Suchen” -box Option ist unsere empfohlene Option, da sie die einzige ist, die den Buchungsablauf nahtlos in Ihre externe Webseite integrieren kann. Auf diese Weise wird der Gast Ihre externe Webseite nie wissentlich verlassen.

💡 Hinweis: Lodgify-Widgets sind kompatibel mit den Standardversionen von WordPress, Squarespace und Wix. Layout- und Themenvariationen können die Kompatibilität beeinflussen. Bei Einbettungsfragen wenden Sie sich bitte an Ihren Entwickler oder Website-Builder-Anbieter.

Springen Sie zum Abschnitt: 

• Verfügbare Widget-Optionen
• Erstellen des Embed-Codes
• Nahtlose Integration der “Suchen” -box auf Ihrer externen Webseite
• Nahtlose Integration der “Suchen” -box auf WordPress
• Weiterführende Ressourcen

Verfügbare Widget-Optionen

Lodgify bietet 2 verschiedene Optionen, um das Lodgify-Reservierungssystem mit einer externen Webseite zu verknüpfen. 

💡 Hinweis: Ältere Versionen der Widgets sind noch verfügbar hier, werden jedoch bald eingestellt. Um mehr zu erfahren, sehen Sie das Ende des Artikels.

Erstellen des Embed-Codes

Sie können die beiden Widgets auf Ihrer externen Webseite verwenden, wenn Sie nur eine Unterkunft anbieten (unabhängig davon, ob diese Unterkunft alte Zimmertypen hat oder nicht). Gäste werden direkt auf Ihre Lodgify Check-out-Seite weitergeleitet, wo sie den Zimmertyp auswählen können, falls Sie einen haben. Um den Embed-Code des externen Widgets zu erstellen und einzubetten, folgen Sie diesen Schritten:

1. Gehen Sie in das Menü auf der linken Seite und wählen Sie Homepage-Gestalter.
2. Gehen Sie jetzt zu Externe Widgets.
   
   
3. Wählen Sie im Widget-Typ aus dem Dropdown-Menü, ob Sie eine “Buchen” -box oder eine “Suchen” -box erstellen möchten.
4. Sie können Folgendes auswählen:
   • Ob automatische Updates für Ihr Widget aktiviert werden sollen, damit Produktaktualisierungen und Fehlerbehebungen automatisch übernommen werden,
   • Ob das Dropdown-Menü für den Standort in der Suchleiste angezeigt oder ausgeblendet werden soll (das Standort-Dropdown gilt nur für die “Suchen” -box),
   • Das Design des Widgets.
     
5. Hier sind einige Einstellungen für das “Buchen” -box:
   • Sie können wählen, ob der "Ab"-Preis im Widget vor der Auswahl der Daten angezeigt wird.
   • Sie können eine feste Währung für alle Gäste im Widget festlegen oder die Währung entsprechend der IP-Adresse Ihrer Gäste einstellen.
     
   • Wenn Sie mehrere Unterkünfte haben und eine “Buchen” -box verwenden möchten, müssen Sie für jede spezifische Unterkunft ein Widget erstellen oder einen Button auf Ihrer externen Webseite erstellen, der zu Ihrer Alle Unterkünfte Seite verlinkt.
6. Wählen Sie die Unterkunft, Sprache, die Sie im Widget verwenden möchten und klicken Sie dann auf Code generieren.
7. Sie werden einen Bereich mit Code sehen, der zwei Code-Einträge enthält. Kopieren Sie zunächst den ersten Code und fügen Sie ihn an der Stelle ein, wo Sie ihn integrieren möchten. Fügen Sie dann direkt unterhalb den zweiten Code hinzu.
   
   Hier sind einige Anweisungen basierend auf verschiedenen möglichen Szenarien:
   • Um mehrere Widgets auf derselben Seite hinzuzufügen: Kopieren und fügen Sie den ersten Code für jedes Widget ein, das Sie hinzufügen möchten, und fügen Sie dann einmal den zweiten Code hinzu.
   • Um Widgets auf verschiedenen Seiten Ihrer Website hinzuzufügen: Kopieren und fügen Sie für jede Seite den ersten Code gefolgt vom zweiten Code ein.
   • Um verschiedene Widget-Optionen auf derselben Seite hinzuzufügen (zum Beispiel “Buchen” -box und “Suchen” -box): Kopieren und fügen Sie sowohl den ersten als auch den zweiten Code für jede Widget-Option auf derselben Seite ein.
8.  

Nahtlose Integration der “Suchen” -box auf Ihrer externen Webseite

Die “Suchen” -box ist die empfohlene Option, wenn Sie mehrere Unterkünfte auf Ihrer Webseite haben. Die nahtlose Integration der “Suchen” -box auf Ihrer externen Webseite bedeutet, dass Sie Lodgify mit einer Subdomain Ihrer externen Webseite verbinden können (z.B. suchen.ihredomain.com oder buchen.ihredomain.com). Auf diese Weise werden die Seiten des Buchungsvorgangs unter Ihrer Subdomain angezeigt und die Gäste haben nicht den Eindruck, dass sie auf eine andere Webseite weitergeleitet werden, sondern dass sie den gesamten Buchungsvorgang auf Ihrer externen Webseite durchlaufen.
💡 Hinweis: Die nahtlose Integrationsoption wird am besten für Webseiten mit mehreren Unterkünften verwendet, da auf Webseiten mit einer einzigen Unterkunft der Suchbutton immer automatisch zur Check-out-Seite weiterleitet.

Um dies einzurichten, müssen Sie 4 Schritte ausführen:

• Erstellen Sie den Embed-Code um das Suchbox-Widget auf Ihrer externen Webseite zu integrieren
• Erstellen Sie eine Subdomain bei Ihrem Domain-Anbieter
• Verlinken Sie die Subdomain mit Ihrem Lodgify-Konto
• Füllen Sie eine benutzerdefinierte Logo-URL aus
  •  

Erstellen Sie den Embed-Code für das Suchbox-Widget

Um den Embed-Code zu erstellen, müssen Sie diese Schritte ausführen:

1. Gehen Sie in das Menü auf der linken Seite und wählen Sie Homepage-Gestalter.
2. Gehen Sie jetzt zu Externe Widgets.
   
   
3. Wählen Sie im Widget-Typ “Suchen” -box aus dem Dropdown-Menü und wählen Sie die Sprache aus.
4. Jetzt können Sie auswählen, ob das Widget in einem neuen Fenster oder im selben Fenster geöffnet werden soll, und die Farbe des Suchbuttons auswählen.
   💡 Hinweis: Wenn Sie das Widget auf einer WIX-Webseite einbetten möchten, müssen Sie die Option In neuem Fenster öffnen auswählen, da das Widget sonst auf WIX nicht ordnungsgemäß funktioniert.
5. Dann Code generieren, kopieren Sie den JavaScript-Code in Ihre Zwischenablage und fügen Sie ihn in Ihre externe Webseite ein (normalerweise in eine Art HTML-Widget).
   💡 Hinweis:  Externe Webseitenkonfigurationen können variieren, jedoch wird das Suchbox-Widget in den meisten Fällen ohne weitere Konfiguration funktionieren, indem der generierte Code in ein Code-Widget Ihres externen Webseiten-Builders eingefügt wird.
   
   1.  

Erstellen Sie eine Subdomain

Wenn Sie möchten, dass Ihr Buchungsvorgang unter einer Subdomain angezeigt wird, müssen Sie dies bei Ihrem Domain-Anbieter einrichten.

1. Gehen Sie zu Ihrem Domain-Anbieter und in den DNS-Bereich Ihres Kontos.
2. Dort können Sie eine Subdomain erstellen.
3. Richten Sie jetzt die beiden A-Records Ihrer Subdomain ein. Finden Sie heraus, welche A-Records Sie hinzufügen müssen in diesem Artikel.
   💡 Hinweis: Der Name der A-Records sollte die Subdomain sein, auf der der Buchungsablauf erscheinen soll. Wenn der Buchungsablauf beispielsweise unter booking.ihredomain.com erscheinen soll, setzen Sie den Namen der A-Records auf "booking".
   1.  

Verlinken Sie die Subdomain mit Ihrer Lodgify-Webseite

Sobald Sie die Subdomain bei Ihrem Domain-Anbieter konfiguriert haben, müssen Sie sie mit Ihrer Lodgify-Webseite verlinken. 

1. Gehen Sie in Lodgify und dann in das Menü auf der linken Seite und wählen Sie Homepage-Gestalter.
2. Wählen Sie jetzt Einstellungen.
3. Wählen Sie den Domain-Tab und klicken Sie auf Bestehende Domain verlinken.
4. Ein neues Pop-Up erscheint, in dem Sie den Namen Ihrer Subdomain eingeben und das Kontrollkästchen markieren müssen, dass Sie eine Subdomain verlinken.
   💡 Hinweis: Wenn Sie dieses Design nicht sehen, bedeutet dies, dass Sie den neuen Homepage-Gestalter verwenden. In diesem Fall müssen Sie nichts tun, da die hinzugefügte Domain standardmäßig eine Subdomain sein wird.
   1.  

Füllen Sie eine benutzerdefinierte Logo-URL aus

Sobald Gäste auf den Suchbutton klicken, werden sie auf Ihre Alle Unterkünfte-Seite in Lodgify weitergeleitet (oder zur Check-out-Seite, wenn Sie nur eine Unterkunft haben). Um die Integration so nahtlos wie möglich zu gestalten, sollten Sie sicherstellen, dass Gäste, wenn sie auf das Logo oder eines der Menüelemente von der Alle Unterkünfte/Check-out-Seite klicken, zu Ihrer externen Webseite weitergeleitet werden.

Gehen Sie dazu wie folgt vor:

1. Gehen Sie in Lodgify und dann in das Menü auf der linken Seite und wählen Sie Homepage-Gestalter.
2. Wählen Sie jetzt Stile.
3. Scrollen Sie ganz nach unten und klicken Sie auf Logo.
   
4. Scrollen Sie dann ganz nach unten und fügen Sie unter Logo-URL den Link zur Homepage Ihrer externen Webseite hinzu.
   1.  

💡 Hinweise:

• Sie sollten die Menüleiste genauso einrichten, wie sie auf Ihrer externen Webseite ist. Gehen Sie einfach zum Seiteneinrichtungsbereich Ihres Homepage-Gestalters und erstellen Sie einen Link für jedes Menüelement, das zur entsprechenden Seite auf Ihrer externen Webseite führt. Erfahren Sie hier mehr über das Erstellen eines Links in Ihrem Lodgify-Menü.
• Sie können CSS verwenden, um das Erscheinungsbild Ihres Lodgify-Menüs an das Ihrer externen Webseite anzupassen. Erfahren Sie hier mehr über benutzerdefinierten Code in Lodgify.

Nahtlose Integration der “Suchen” -box auf WordPress

Sie können das Suchbox-Widget ganz einfach mit dem Lodgify-Plugin zu Ihrer WordPress-Webseite hinzufügen. Nach der Einrichtung können Sie es schnell und mühelos an mehreren Stellen auf Ihrer Seite hinzufügen.

Um das Suchbox-Widget mit dem Lodgify-Plugin auf WordPress zu integrieren, folgen Sie diesen Schritten:

1. Loggen Sie sich in Ihr WordPress-Konto ein und navigieren Sie zu Plugins.
2. Suchen Sie nach Lodgify und wählen Sie das Plugin Booking Engine by Lodgify:
3. Gehen Sie in Lodgify und dann in das Menü auf der linken Seite und wählen Sie Homepage-Gestalter.
4. Gehen Sie jetzt zu Externe Widgets.
   
   
5. Wählen Sie unter Widget-Typ die Option “Suchen” -box.
6. Erzeugen Sie als Nächstes den Code, kopieren Sie den JavaScript-Code und fügen Sie ihn auf der Plugin-Seite in WordPress ein. Klicken Sie dann auf Speichern.
7. Um das Plugin auf einer bestimmten Seite hinzuzufügen, gehen Sie zu Ihren WordPress-Seiten, bearbeiten Sie die Seite, auf der das Plugin erscheinen soll, und wenn Sie einen neuen Block hinzufügen, wird das Plugin als Lodgify-Such-Widget angezeigt: