Richten Sie das Knocket Web Widget

Übersicht

Öffne die Knocket-Konsole und klicke in der linken Seitenleiste auf Web-Widget. Die Seite ist in drei Tabs unterteilt – Erscheinungsbild, Startseite und Konversationsseite – und rechts befindet sich eine Live-Smartphone-Vorschau, die während der Bearbeitung aktualisiert wird. Nichts wird veröffentlicht, bis du unten auf Speichern klickst.

Erscheinungsbild

Auf der Registerkarte Erscheinungsbild legst du das Aussehen des Widgets fest — die Sprache aller UI-Texte, die Akzentfarbe, die Form des Launchers und die FAQ-Einträge, die angezeigt werden, bevor ein Besucher eine Unterhaltung beginnt. Jede Änderung hier wird sofort in der Vorschau rechts dargestellt.

• Designfarbe. Wähle eine der zehn Voreinstellungen aus oder füge einen Hexadezimalwert ein (z. B. #1C66E5). Die Farbe bestimmt den Farbverlauf der Kopfzeile, die Schaltfläche „Chat starten“ und die Launcher-Blase.
• Live-Chat-Schaltfläche. Wählen Sie zwischen einem runden Symbol-Launcher und einer pillenförmigen „Chatten Sie mit uns“-Schaltfläche, je nachdem, wie deutlich der Einstiegspunkt hervorgehoben werden soll.
• FAQs. Füge bis zu einige häufig gestellte Fragen mit kurzen Antworten hinzu. Deaktiviere den Abschnitt, wenn sie überhaupt nicht angezeigt werden sollen. Klicke zum Bearbeiten auf den Stift und zum Entfernen auf den Papierkorb.

Sprache

Öffne oben auf der Registerkarte „Darstellung“ das Dropdown-Menü Sprache und wähle eine Sprache aus der integrierten Liste aus – English, Türkçe, Nederlands, हिन्दी, العربية, Tiếng Việt, ภาษาไทย, українська und weitere. Jeder UI-Text im Widget – Begrüßungen, Formularfelder, Fehlermeldungen und RTL-Layout – wird sofort umgestellt.

Startseite

Die Registerkarte Startseite sehen Besucher direkt nach dem Öffnen des Widgets — noch bevor sie eine Unterhaltung begonnen haben. Hier legen Sie die Begrüßung, Ihr Markenlogo und die Verknüpfungen (Live-Chat, Terminplaner, soziale Medien) fest, über die Besucher Sie auf ihrem bevorzugten Weg erreichen können.

1. Kopfzeile — Markenlogo. Lade eine quadratische PNG- oder SVG-Datei hoch (Ersetzen / Entfernen). Es befindet sich oben links in der Kopfzeile des Widgets.
2. Willkommensnachricht. Lege den Willkommenstitel (z. B. Willkommen 👋) und eine einzeilige Beschreibung (Wie können wir dir heute helfen?) fest. Beide unterstützen Emojis.
3. Live-Chat. Aktivieren Sie diese Option, um Gespräche in Echtzeit zu ermöglichen. Dies ist die Karte „Chat starten · Wir antworten innerhalb weniger Minuten“ auf der Startseite des Widgets.
4. Terminplaner. Aktivieren und eine Meeting-URL einfügen – Calendly, Cal.com, SavvyCal oder einen beliebigen Terminplanungslink. Besucher tippen auf „Meeting buchen“, um ihn in einem neuen Tab zu öffnen.
5. Soziale Medien. Aktiviere die Option und füge deine Benutzernamen/URLs für WhatsApp, Instagram, Telegram und Messenger ein. Jeder Kanal wird als Symbol in der Schnellkontaktleiste angezeigt.

Jedes Feld ist optional — lassen Sie einen Kanal leer, und sein Symbol verschwindet aus dem Widget.

Konversationsseite

Auf der Registerkarte Konversationsseite legen Sie fest, was geschieht, sobald ein Besucher auf Chat starten tippt. Legen Sie den Namen Ihres Assistenten und die Verfügbarkeit fest und bestimmen Sie, welche Informationen von Besuchern erfasst werden sollen, bevor die Konversation beginnt.

• Dein Name. Der im Kopfbereich der Unterhaltung angezeigte Name (z. B. Assistent). Füge hier den Namen eines echten Teammitglieds hinzu, um persönlicher zu wirken.
• Begrüßung. Die erste Nachricht, die der Besucher im Gesprächsfenster sieht – Hallo. Wie kann ich Ihnen heute helfen?
• Verfügbare Zeit. Wählen Sie Immer verfügbar oder Nach Zeitplan verfügbar. Wählen Sie bei einem Zeitplan eine Zeitzone aus und fügen Sie einen oder mehrere Tages-/Zeiträume hinzu (z. B. Montag–Freitag · 09:00–21:00).
• Offline-Nachricht. Wird angezeigt, wenn ein Besucher außerhalb Ihres Verfügbarkeitszeitraums eintrifft — Wir sind derzeit offline. Bitte hinterlassen Sie eine Nachricht. Wir antworten Ihnen in Kürze.
• Besucherinformationen erfassen. Wähle Aus, Vor dem Gespräch (immer fragen) oder Bei Abwesenheit (nur wenn du nicht erreichbar bist). Aktiviere anschließend die einzelnen Felder – Name, E-Mail, Telefonnummer, Nachricht – und kennzeichne sie jeweils als Pflichtfeld oder optionales Feld.

Auf Ihrer Website installieren

Sobald Ihr Widget in der Vorschau richtig aussieht, öffnen Sie Installation in der Seitenleiste und kopieren Sie das Snippet. Fügen Sie es davor ein </body> auf jeder Seite, auf der das Widget erscheinen soll – WordPress, Shopify, Webflow, Next.js, einfaches HTML oder alles andere, was der Browser darstellen kann. Siehe die spezielle Web-Widget-Produktseite für die plattformspezifische Platzierung.

1. Schließe die Konfiguration der Darstellung, der Startseite und der Konversationsseite ab. Klicke auf Speichern.
2. Klicken Sie in der linken Seitenleiste auf Installation.
3. Kopiere das einzeilige <script>-Tag – es enthält bereits deine eindeutige Kennung.
4. Füge es direkt vor dem schließenden </body>-Tag deiner Website ein und stelle die Änderungen bereit.
5. Neu laden – der Launcher erscheint unten rechts. Nachrichten werden in Echtzeit an deinen Knocket-Posteingang und Telegram weitergeleitet.

FAQ

Erfordern Änderungen eine erneute Bereitstellung?

Nein. Alles, was Sie in der Konsole ändern – Farben, Begrüßungstext, FAQs, Verfügbarkeit – wird innerhalb weniger Sekunden live im Widget aktualisiert. Nur für die erstmalige Installation des Skript-Tags müssen Sie Änderungen an Ihrer Website vornehmen.

Was passiert, wenn ich WhatsApp / Instagram / Telegram / Messenger leer lasse?

Das Symbol wird in der Quick-Connect-Zeile einfach nicht angezeigt. Aktivieren Sie jederzeit einen Kanal und fügen Sie die URL ein – sie erscheint sofort.

Wie funktioniert der Offline-Ablauf?

Außerhalb Ihrer Verfügbarkeitszeiten sehen Besucher Ihre Offline-Nachricht und das Formular vor dem Chat, sofern es mit „Wenn offline“ aktiviert wurde. Sie hinterlassen ihre Kontaktdaten und eine Nachricht; Sie antworten über den Knocket-Posteingang oder Telegram, und die Unterhaltung wird an derselben Stelle fortgesetzt.

Können Besucher Bilder oder Dateien senden?

Ja – Anhänge (Bilder, Videos, Dateien) werden in jeder Unterhaltung unterstützt und erscheinen zusammen mit dem Text sowohl in deinem Posteingang als auch in Telegram.

Welche Rolle spielt der KI-Agent?

Wenn der KI-Agent in Ihrem Arbeitsbereich aktiviert ist, werden eingehende Widget-Nachrichten zunächst an den Agenten weitergeleitet. Er beantwortet Routinefragen und übergibt an einen Menschen, wenn er nicht weiterweiß. Siehe Tutorial für den KI-Agenten.