Zeeg in WordPress einzubetten bedeutet, deine Buchungsseite mithilfe eines HTML-Code-Snippets direkt in eine WordPress-Seite oder einen Beitrag zu integrieren. Anstatt Besucher auf einen externen Link weiterzuleiten, können sie einen Termin direkt auf deiner Website buchen – für ein konsistentes Markenerlebnis und weniger Absprünge.
Die Einbettungsfunktion ist in allen Tarifen verfügbar, einschließlich des kostenlosen Tarifs. Erweiterte Farbanpassungen (Hintergrundfarbe, Textfarbe sowie Button- und Linkfarbe) sind ab dem Professional-Tarif verfügbar.
Voraussetzungen
Stelle sicher, dass du Folgendes bereit hast:
Eine erstellte Buchungsseite in deinem Zeeg-Dashboard
Zugang zu deinem WordPress-Adminbereich
Die Möglichkeit, HTML in deine Seiten einzufügen (im Standard-WordPress-Editor oder in Elementor verfügbar)
Schritt 1: Einbettungscode aus Zeeg kopieren
1. Suche in deinem Zeeg-Dashboard die Buchungsseite, die du einbetten möchtest, und klicke auf Teilen.
2. Wähle im Popup Zur Website hinzufügen.
3. Wähle Inline-Einbettung.
4. Passe das Erscheinungsbild bei Bedarf an — ab dem Zeeg Professional-Tarif kannst du Farben anpassen und bestimmte Elemente ausblenden (Profilbild, Name, Dauer, Ort und Beschreibung), indem du Details ausblenden auswählst.
5. Klicke auf Kopieren, um den Einbettungscode in die Zwischenablage zu übernehmen.
Schritt 2: Einbettungscode in WordPress einfügen
Je nach Aufbau deiner WordPress-Website gibt es mehrere Möglichkeiten, den Einbettungscode hinzuzufügen.
Mit dem Block-Editor (Gutenberg)
Dies ist der Standardeditor für WordPress-Websites ab Version 5.0.
Öffne die WordPress-Seite oder den Beitrag, in den du den Scheduler einbetten möchtest.
Klicke auf die Schaltfläche +, um einen neuen Block hinzuzufügen.
Suche nach dem Block Benutzerdefiniertes HTML und wähle ihn aus.
Füge deinen Zeeg-Einbettungscode in den Block ein.
Klicke auf Vorschau, um das Ergebnis zu prüfen, und anschließend auf Aktualisieren oder Veröffentlichen, um zu speichern.
Mit dem Classic Editor
Falls deine Website das Classic-Editor-Plugin oder eine ältere WordPress-Version verwendet:
Öffne die Seite oder den Beitrag, in den du den Scheduler einfügen möchtest.
Wechsle im Editor auf den Tab Text (nicht „Visuell").
Füge den Zeeg-Einbettungscode an der gewünschten Stelle ein.
Klicke auf Aktualisieren oder Veröffentlichen.
Mit einem Website Builder (Elementor, Divi usw.)
Die meisten gängigen Builder unterstützen eigene HTML-Widgets oder -Module:
Bearbeite die Seite in deinem Website Builder.
Füge ein HTML-Widget oder ein Code-Modul in den gewünschten Bereich ein.
Füge den Zeeg-Einbettungscode in das Widget ein.
Speichere und veröffentliche die Seite.
Schritt 3: Einbettung überprüfen
Nachdem du gespeichert und veröffentlicht hast, rufe die Seite auf deiner Website auf und stelle sicher, dass das Buchungs-Widget korrekt geladen wird. Der Kalender sollte deine verfügbaren Zeitfenster anzeigen und Besuchern die direkte Buchung ermöglichen.
URL-Weiterleitung bei der Zeeg-Einbettung
Wenn ein Besucher über den eingebetteten Scheduler einen Termin bucht, erfolgen Weiterleitungen der Bestätigungsseite standardmäßig innerhalb der Einbettung (iFrame) – nicht auf der übergeordneten Seite.
Wenn du nach einer Buchung die gesamte Browser-Seite weiterleiten möchtest, füge data-redirect-parent="true" in deinen Einbettungscode ein:
<!-- Zeeg inline embed begins -->
<div class="zeeg-inline-widget" id="zeeg-embed-demo-hr-30min" style="min-width: 320px; height: 780px"></div>
<script type="text/javascript" src="https://assets.zeeg.me/embed.min.js" data-user="demo" data-event-type="hr-30min" data-redirect-parent="true" async></script>
<!-- Zeeg inline embed ends -->
Ersetze demo durch deinen Zeeg-Benutzernamen und hr-30min durch den Slug deiner Buchungsseite.
Fehlerbehebung
Die Einbettung wird auf meiner Seite nicht angezeigt. Stelle sicher, dass du den Code in einen HTML-Block oder in den Text-Modus eingefügt hast – nicht in den visuellen Editor, da dieser den Script-Tag möglicherweise entfernt.
Der Scheduler wird abgeschnitten dargestellt. Passe den height-Wert im Style-Attribut des Einbettungscodes an (z. B. height: 780px auf einen größeren Wert erhöhen), bis der Scheduler vollständig sichtbar ist.
Die Einbettung sieht fehlerhaft oder unformatiert aus. Manche WordPress-Themes oder Caching-Plugins können eingebettete Scripts beeinträchtigen. Leere deinen Cache oder prüfe in der Dokumentation deines Themes, ob benutzerdefinierte HTML-Scripts freigegeben werden müssen.
FAQ
Kann ich mehrere Buchungsseiten auf derselben WordPress-Website einbetten? Ja. Du kannst verschiedene Einbettungscodes für unterschiedliche Buchungsseiten auf verschiedenen Seiten oder Beiträgen deiner WordPress-Website verwenden.
Funktioniert die Einbettung auch auf Mobilgeräten?
Ja. Die Zeeg-Einbettung ist responsiv und passt sich an verschiedene Bildschirmgrößen an, einschließlich Smartphones und Tablets.
Kann ich meinen Namen oder mein Profilbild in der Einbettung ausblenden?
Ja. Wähle im Zeeg-Teilen-Dialog Details ausblenden, bevor du den Einbettungscode kopierst, um Profilbild, Name, Dauer, Ort und Beschreibung aus der eingebetteten Ansicht zu entfernen.
Benötigen Besucher ein Zeeg-Konto, um einen Termin zu buchen?
Nein. Besucher können direkt über den eingebetteten Scheduler buchen, ohne ein Konto erstellen zu müssen.