Cursor-Integration
Live-Chat zu einer mit Cursor gebauten Website hinzufügen
In Cursor schreibt der Agent den Code. Gib ihm den Hooky-Prompt: Er findet das gemeinsame Template deines Projekts, egal welches Framework, und fügt die Chat-Bubble ein. Du deployst wie immer und antwortest vom Handy.
Warum ein Chat auf deiner Website
Wenn du mit Cursor programmierst, hast du alles im Griff: Framework, Hosting, Domain. Einen Echtzeit-Chat selbst zu bauen heißt aber Backend, Websockets, eine Handy-App zum Antworten … Hooky liefert dir das alles mit einer Zeile Code: die Bubble auf deiner Website, Posteingang und Benachrichtigungen auf deinem Handy.
Hooky mit dem Cursor-Agent installieren
Erstelle dein Hooky-Konto (kostenlos für eine Website), lege deine Website an und kopiere ihren Prompt unter Websites: Der Schlüssel ist schon drin.
Öffne dein Projekt in Cursor und starte den Agent im Seitenbereich (Cmd+I auf dem Mac).
Füge den Prompt ein. Der Agent sucht das Template, das alle Seiten teilen, und fügt das Tag ein. Prüfe den Diff, bevor du ihn annimmst: Es sollte genau eine Zeile dazukommen (zwei mit dem Import bei Next.js).
Deploye wie immer: Commit, Push oder der Befehl deines Hosters (Vercel, Netlify, eigener Server …). Cursor veröffentlicht deine Website nicht für dich.
Der Prompt für Cursor
Füge die Hooky-Chat-Bubble zu dieser Website hinzu, auf allen Seiten. Finde das HTML-Template, das alle Seiten teilen (index.html bei React oder Vite, app/layout.tsx bei Next.js mit der Script-Komponente aus next/script und strategy="afterInteractive", das Basis-Layout bei Astro, Nuxt, SvelteKit, Rails oder Django), und setze dieses Tag dort ein einziges Mal direkt vor </body> ein:
<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: Die Bubble erscheint von selbst. Wenn die Website mehrere unabhängige Templates hat, setze das Tag in jedes und sag mir, in welche.
Der Cursor-Agent kann auch die Hooky-Doku für KIs lesen: Beginne den Prompt mit „Lies zuerst https://heyhooky.com/llms.txt“, dann weiß er auch, wie er deine Conversions mit Hooky.track zählt.
Lokal testen, dann live
Um die Bubble auf deinem Dev-Server zu sehen, trag localhost in die erlaubten Adressen der Website in Hooky ein (alle Ports inklusive), oder trag noch gar keine Adresse ein: Dann funktioniert die Bubble überall. Eine als Datei geöffnete Seite (file://) hat keine Adresse: Liefere sie über einen kleinen lokalen Server aus.
Nach dem Deployment öffnest du deine Domain: Die Bubble ist unten, und deine Testnachricht landet unter Nachrichten.
Mehr mit dem Agent
- Ein „Schreib uns“-Button: Lass ihn beim Klick
Hooky.open()aufrufen (Doku). - Deine Statistiken:
Hooky.track("anmeldung")nach einer erfolgreichen Anmeldung,Hooky.track("bestellung", { value: 49 })nach einer Zahlung (Doku). - Serverseitig: Events über die API mit dem geheimen Schlüssel der Website, oder deine Hinweise (Bestellung, Deployment, Fehler) im Kanal der Website, im Format der Slack-Webhooks (Doku).
Häufige Fragen
Kann Cursor Hooky installieren, ohne dass ich das Dashboard öffne?
Ja. Sag dem Agent: „Lies https://heyhooky.com/llms.txt, erstelle mir dann ein Hooky-Konto mit meiner E-Mail und installiere die Bubble auf https://meine-seite.de“. Er ruft die Registrierungs-API auf, setzt das Tag, und du bekommst eine E-Mail zum Aktivieren deines Kontos. Siehe Ein Konto per KI erstellen.
Und der MCP-Server?
Der kommt bald: Dann kann Cursor Hooky selbst installieren. Bis dahin erledigen Prompt und llms.txt die Arbeit.
Meine Website hat eine strenge CSP
Erlaube mindestens https://heyhooky.com für Skripte sowie https://api.heyhooky.com und wss://api.heyhooky.com für Verbindungen (Anfragen und Echtzeit). An Nachrichten angehängte Fotos können von einem anderen Ursprung kommen: Wird eins nicht angezeigt, sagt dir die Browser-Konsole, was fehlt.
Macht die Bubble meine Website langsamer?
Sie lädt async, ohne Abhängigkeiten und ohne Cookies, und lebt in einem Shadow DOM: Sie blockiert das Rendern nicht und lässt deine Styles in Ruhe.
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.