Zum Hauptinhalt springen
Hebelki
Zurueck zur Uebersicht

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:

  1. 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 BetriebAllgemein).

  1. Passen Sie die Hoehe nach Bedarf an. Empfohlen sind mindestens 600px.
  2. 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:

  1. 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>

  1. 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:

  1. Navigieren Sie zu Mein Betrieb → Tab Erscheinungsbild.
  2. Waehlen Sie Ihre Primaerfarbe. Diese wird fuer Buttons, Links und Akzente in allen Widgets verwendet.
  3. Laden Sie Ihr Logo hoch. Es erscheint im Header des Chat-Widgets und auf der Buchungsseite.
  4. 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.