Bolt-Integration
Live-Chat zu deiner Bolt-Website hinzufügen
Du hast deine Website mit Bolt gebaut, sie ist online auf bolt.host oder deiner Domain. Hooky gibt ihr mit einem Prompt eine Chat-Bubble: Deine Besucher schreiben, du antwortest vom Handy.
Warum ein Chat auf einer Bolt-Website
Mit Bolt startet man oft schnell: eine Landingpage, ein kleiner Shop, ein Tool für deine Kunden. Genau dann kommen die ersten Fragen, und die willst du hören. Eine Chat-Bubble ist der kürzeste Weg zwischen einem zögernden Besucher und dir.
Bolt-Projekte sind echter Code (oft React mit Vite, manchmal Next.js oder Astro). Hooky fügt nur ein <script>-Tag ein, im gemeinsamen Template aller Seiten: keine Abhängigkeit, keine Komponente zu pflegen.
Hooky in Bolt installieren
Erstelle dein Hooky-Konto (kostenlos für eine Website) und lege deine Website mit ihrer Adresse an, zum Beispiel
meine-seite.bolt.host.Kopiere den Prompt unter Websites: Der Schlüssel deiner Website ist schon drin. Hier die Version für Bolt, mit Beispielschlüssel.
Füge ihn in den Chat deines Bolt-Projekts ein und lass Bolt den Code ändern. Schau in die Vorschau: Sonst sollte sich nichts verändert haben.
Veröffentliche: Button Publish oben rechts, dann Publish (oder Update, wenn die Website schon online ist) im Menü. Bolt empfiehlt diese Buttons statt eines Prompts wie „veröffentliche meine Website“, der Tokens kostet.
Der Prompt für Bolt
Füge die Hooky-Chat-Bubble zu dieser Website hinzu, auf allen Seiten. Setze dieses Tag ein einziges Mal direkt vor </body> ein, im HTML-Template, das alle Seiten teilen (index.html bei einem Vite-Projekt, app/layout.tsx mit der Script-Komponente aus next/script und strategy="afterInteractive" bei Next.js, das Haupt-Layout bei Astro):
<script src="https://heyhooky.com/widget.js" data-site-key="DEIN_OEFFENTLICHER_SCHLUESSEL" async></script>
Ändere weder die Script-Adresse noch das Attribut data-site-key. Füge keinen weiteren Code hinzu und ändere sonst nichts: Die Bubble erscheint von selbst, unten auf dem Bildschirm.
Prüfen, ob die Bubble erscheint
Nach dem Veröffentlichen zeigt Bolt den Link deiner Website im Chat: Öffne ihn in einem neuen Tab. Die Bubble ist unten. Schick eine Testnachricht: Sie landet unter Nachrichten und in der App, falls du sie installiert hast.
Keine Bubble? Prüfe, ob du neu veröffentlicht hast, ob die geöffnete Adresse in den erlaubten Adressen der Website in Hooky steht (falls du welche eingetragen hast), und lade ohne Cache neu.
bolt.host und deine eigene Domain
Bolt veröffentlicht kostenlos unter einer bolt.host-Adresse; mit einem bezahlten Bolt-Plan kannst du deine Domain verbinden. Trag beide Adressen auf der Seite der Website in Hooky ein: ein Posteingang, dieselben Statistiken, dieselbe Bubble. Und wenn du eine private Website veröffentlichst (bezahlte Bolt-Pläne), sehen nur eingeladene Besucher die Bubble, wie den Rest der Website.
Deinen Besuchern antworten
Du antwortest in der Hooky-App (iPhone, iPad, Mac, Android) oder im Web-Dashboard, mit einer Benachrichtigung bei jeder neuen Nachricht. Deine Besucher brauchen kein Konto; sie können ein Foto oder ein PDF anhängen und ihre E-Mail hinterlassen, damit deine Antwort sie erreicht, falls sie vorher gehen.
Willst du wissen, ob dein Launch funktioniert? Lass Bolt nach jeder Anmeldung Hooky.track("anmeldung") aufrufen: Die Zahlen erscheinen im Tab Statistiken. Details in der Doku.
Häufige Fragen
Mein Bolt-Projekt hat keine index.html
Das ist bei Next.js- oder Astro-Projekten so. Der Prompt berücksichtigt das: Bolt setzt das Tag ins gemeinsame Layout. Bei Next.js nutzt es die Script-Komponente, wie in der Doku beschrieben.
Und wenn meine Bolt-Website auf Netlify läuft?
Für Hooky ändert das nichts: Das Tag steckt in deinem Code und geht bei jeder Veröffentlichung mit. Trag einfach die Netlify-Adresse bei den Adressen der Website ein.
Stört die Bubble das Design meiner Website?
Nein: Sie lebt in einem Shadow DOM, getrennt von deinen Styles. Farbe, Seite (rechts oder links) und Begrüßung wählst du in Hooky, mit Vorschau, ohne den Code anzufassen.
Kann ich sie über einen „Kontakt“-Button öffnen?
Ja. Sag Bolt: „Der Kontakt-Button öffnet die Hooky-Bubble mit Hooky.open().“ Das steht in der Doku.
Weitere Tools
Deine Besucher haben Fragen. Antworte, wo immer du bist.
Kostenlos für eine Website, mit einem Prompt installiert. Danach reicht das Handy in der Tasche.