Widgets und Einbettung
Betten Sie Buchungs- und Chat-Widgets auf Ihrer eigenen Website ein.
Widgets-Uebersicht
Hebelki bietet einbettbare Widgets, die Sie auf jeder externen Website integrieren koennen. So erreichen Ihre Kunden Buchung und Chat direkt von Ihrer Homepage aus.
Verfuegbare Widgets:
- Buchungs-Widget – Terminbuchung direkt auf Ihrer Website (
/embed/book/{slug}) - Chat-Widget – KI-Chatbot als Fenster auf Ihrer Website (
/embed/chat/{slug})
Beide Widgets passen sich automatisch an die Farben Ihres Unternehmens an (primaere Farbe aus den Branding-Einstellungen).
Buchungs-Widget einbetten
So binden Sie das Buchungs-Widget auf Ihrer Website ein:
- Kopieren Sie den folgenden iframe-Code und fuegen Sie ihn in den HTML-Code Ihrer Website ein:
<iframe src="https://www.hebelki.de/embed/book/{ihr-slug}" width="100%" height="700" frameborder="0"></iframe>
Ersetzen Sie {ihr-slug} durch den Slug Ihres Unternehmens (zu finden unter Mein Betrieb → Allgemein).
- Passen Sie die Hoehe nach Bedarf an. Empfohlen sind mindestens 600px.
- Fuer eine responsive Einbettung verwenden Sie
width="100%".
Tipp: Testen Sie das Widget auf verschiedenen Bildschirmgroessen (Desktop, Tablet, Smartphone), um sicherzustellen, dass es ueberall gut dargestellt wird.
Chat-Widget einbetten
So binden Sie den Chat-Assistenten auf Ihrer Website ein:
- Kopieren Sie den folgenden iframe-Code:
<iframe src="https://www.hebelki.de/embed/chat/{ihr-slug}" width="400" height="600" frameborder="0" style="border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.15);"></iframe>
- Alternativ koennen Sie den Chat als schwebendes Fenster in der Ecke Ihrer Website platzieren:
<div style="position: fixed; bottom: 20px; right: 20px; z-index: 9999;"><br><iframe src="https://www.hebelki.de/embed/chat/{ihr-slug}" width="380" height="550" frameborder="0" style="border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.2);"></iframe><br></div>
Ersetzen Sie {ihr-slug} durch den Slug Ihres Unternehmens.
Widgets farblich anpassen
Die Widgets uebernehmen automatisch das Branding Ihres Unternehmens:
- Navigieren Sie zu Mein Betrieb → Tab Erscheinungsbild.
- Waehlen Sie Ihre Primaerfarbe. Diese wird fuer Buttons, Links und Akzente in allen Widgets verwendet.
- Laden Sie Ihr Logo hoch. Es erscheint im Header des Chat-Widgets und auf der Buchungsseite.
- Klicken Sie auf Speichern.
Die Aenderungen werden sofort in allen eingebetteten Widgets wirksam – Sie muessen den Widget-Code nicht neu einbinden.
Oeffentliche Buchungs- und Chat-Seiten
Neben den einbettbaren Widgets bietet Hebelki auch eigenstaendige oeffentliche Seiten, die Sie direkt verlinken koennen:
- Buchungsseite:
https://www.hebelki.de/book/{ihr-slug} - Chat-Seite:
https://www.hebelki.de/{ihr-slug}/chat
Diese Links koennen Sie ueberall verwenden: in E-Mail-Signaturen, auf Visitenkarten, in Social-Media-Profilen oder als QR-Code.
Tipp: Die oeffentliche Chat-Seite zeigt das volle Branding mit Logo, Firmenname und Begruessung. Ideal als direkter Kommunikationskanal.