Website-Widget installieren
Erstellen Sie ein Chat-Widget, passen Sie sein Aussehen an, kopieren Sie den Installationscode und beschränken Sie, welche Domains es nutzen dürfen.
Für Website-Betreiber oder Marketingteams, die möchten, dass Besucher direkt chatten und im selben Posteingang landen wie bei WhatsApp.
Was es tut
Das Chat-Widget ist ein Chat-Button auf Ihrer Website (es kann auch über einen direkten Chat-Link oder eine mobile App genutzt werden). Nachrichten landen in der Inbox, werden von der KI und den Agents beantwortet, und Prospects werden in Prospect erfasst.
Vorteile
- Sie erreichen Website-Besucher, ohne dass diese zu WhatsApp wechseln müssen.
- Ein kurzer Code, installierbar auf WordPress, Shopify, Google Tag Manager oder Next.js.
- Das Aussehen folgt Ihrer Marke.
- Die Domain-Sperre verhindert, dass der Code auf anderen Websites verwendet wird.
Schritte
- Menü öffnen. Gehen Sie zu Einstellungen → Chat-Widget (innerhalb des Workspace).
- Widget erstellen. Klicken Sie auf Widget erstellen (oder Neues Widget), geben Sie einen Widget-Name wie „Hauptwebsite“ ein und klicken Sie auf Erstellen.
- Aussehen anpassen. Auf dem Tab Darstellung: Designfarbe, Button-Position (Unten rechts oder Unten links), Titel, Begrüßungsnachricht und Text neben dem Button.
- Besucherformular einrichten. Der Tab Besucherformular legt fest, welche Daten vor dem Chat abgefragt werden (Name, WhatsApp-Nummer, E-Mail) und ob jede Angabe erforderlich, optional oder ausgeblendet ist.
- Verhalten und Domain-Sperre festlegen. Der Tab Verhalten enthält Anhänge zulassen, Auf Mobilgeräten ausblenden, Offline-Text und An Domain binden. Geben Sie eine Domain pro Zeile ein, z. B.
kiranabakery.co.id; Subdomains sind ebenfalls erlaubt. Leer bedeutet alle Domains. - KI & Persona einrichten. Der Tab KI & Persona verwendet die Hauptanweisungen des AI Agent, sofern Sie keine widget-spezifischen Anweisungen eintragen.
- Installationscode kopieren. Wählen Sie auf dem Tab Installieren die Option Website, klicken Sie auf Kopieren und fügen Sie den Code auf jeder Seite vor dem Tag
</body>ein. Anleitungen gibt es für WordPress, Google Tag Manager, Shopify und Next.js / React. - Speichern und testen. Klicken Sie auf Speichern, öffnen Sie Ihre Website und senden Sie eine Testnachricht. Der Tab Installieren enthält außerdem einen Direktlink für eine vollständige Chat-Seite (ideal für eine Instagram-Bio oder einen QR-Code).
Tipps
Öffnen Sie das Dashboard beim Kopieren des Codes über Ihre öffentliche Domain. Wird das Dashboard über eine lokale Adresse geöffnet, zeigt Kalea eine Warnung an, weil der erzeugte Code auf diese Adresse verweist.
Neu generieren bei der Widget-ID führt dazu, dass der alte Code auf Ihrer Website nicht mehr funktioniert. Tun Sie dies nur, wenn es nötig ist.