Die Einstellungen der Chat-Widget

In diesem Artikel erfahren Sie, wie Sie Ihre Chat-Widget einrichten und an Ihre individuellen Vorlieben anpassen können.

Video ansehen:

Falls Sie noch keine Chat-Widget erstellt haben, lesen Sie hier, wie Sie dies tun.

Wenn Sie bereits eine Chat-Widget erstellt haben, navigieren Sie in Apps zur entsprechenden Widget.

Name und Widget ausblenden

Standardmäßig wird der Name Ihres Chat-Widgets automatisch auf Ihren Unternehmensnamen gesetzt. Sie können diesen nach Belieben anpassen. Der Name ist für Kunden nicht sichtbar.

Mit Website-Widget ausblenden können Sie das gesamte Chat-Widget auf Ihrer Website (vorübergehend) ausblenden, ohne dass Sie den Code von Ihrer Website entfernen müssen.

Scherm­afbeelding 2025-07-01 om 09.32.48

Anzeigeoptionen

Unter den Anzeigeoptionen können Sie auswählen, wie das Chat-Widget angezeigt werden soll: als Widget oder im Vollbildmodus.

Scherm­afbeelding 2025-07-01 om 09.32.53

Personalisierung der Chat-Widget

Nun können Sie das Chat-Widget Schritt für Schritt gestalten. Dies ist in vier Registerkarten unterteilt: Lokalisieren, Design, Ansprechen und Platzierung. Nachfolgend finden Sie eine Erläuterung zu jedem Tab:

Jedes Mal, wenn Sie eine Änderung vornehmen, wird diese automatisch rechts in der Vorschau des Chat-Widgets angezeigt – so wie Ihre Kunden es sehen werden. Auch dort gibt es verschiedene Registerkarten, mit denen Sie sehen können, wie die unterschiedlichen Ansichten des Website-Widgets dargestellt werden:

  • Willkommen ist der Start der Unterhaltung

  • Chat zeigt die Ansicht, wenn jemand gerade eine Unterhaltung führt

  • Minimieren zeigt, wie Ihr KI Agent aussieht, wenn die Unterhaltung noch nicht geöffnet oder über das Minuszeichen minimiert wurde

  • Datenschutz für die Datenschutzrichtlinie

  • Geschlossen zeigt die Ansicht außerhalb der Geschäftszeiten – es ist dann nur möglich, Nachrichten zu senden, wenn der KI Agent aktiv ist

Damit die Änderungen auch auf Ihrer Website sichtbar sind, müssen Sie die Anpassungen speichern.

Tab 1: Lokalisieren

Unter Lokalisieren können Sie Datum und Sprache einstellen, zum Beispiel Niederländisch oder Englisch. Wenn Sie Benutzerdefiniert auswählen, können Sie eigene Übersetzungen erstellen – etwa wenn Sie das Widget in einer Sprache verwenden möchten, die wir nicht standardmäßig anbieten, oder wenn Sie die Standardtexte anpassen möchten.

Wenn Sie Benutzerdefiniert wählen, können Sie folgende Texte anpassen:

  • Die Buttons zur Annahme oder Ablehnung der Datenschutzrichtlinie

  • Den Text im Willkommensbildschirm

  • Den Text im Chatbildschirm

  • Statusmeldungen im Chat

Für jeden Text, den Sie anpassen, wird eine Beschreibung angezeigt, was genau verändert wird – auf der rechten Seite sehen Sie, wo dieser Text im Chat-Widget sichtbar ist.

Klicken Sie unten auf Änderungen speichern.

Feld ausblenden? Wählen Sie „Angepasst“ und setzen Sie nur ein Leerzeichen.

Tab 2: Design

Unter Design können Sie eine von uns erstellte Vorlage auswählen und verwenden. Sie können auch Änderungen vornehmen und das Widget ganz nach Ihren Wünschen gestalten. Folgende Elemente können Sie anpassen und/oder hinzufügen:

  • Ein Titel oder Logo: Der Titel ist standardmäßig Ihr Unternehmensname. Wenn Sie kein Logo hinzufügen, wird der Titel im Chat-Widget angezeigt.

  • Ihr Avatar: Ihr Marken-Avatar wird angezeigt, wenn kein KI Agent aktiv ist und das Gespräch keinem Mitarbeiter zugewiesen wurde.

  • Die Farben des Widgets und des Hintergrunds: Sie können Farb-Codes eingeben oder im Pop-up die gewünschte Farbe auswählen. Denken Sie dabei nicht nur an die Farben Ihrer Organisation, sondern auch an die Lesbarkeit des Widgets!

  • Benutzer im Willkommensbildschirm: Hier können Sie angeben, welche Benutzer im Willkommensbildschirm angezeigt werden sollen, wenn kein KI Agent aktiv ist.

  • Nachrichtenblasen: Hier können Sie zwischen Standard und Benutzerdefiniert wählen. Bei Standard können Sie nur die Farben des KI Agenten und des Endbenutzers anpassen (2 Anpassungsmöglichkeiten). Bei Benutzerdefiniert können Sie jede Nachrichtenblase einzeln gestalten. Sie können hier Farben, Eckenradius, Schriftarttyp und -größe einstellen.

  • Schriftart: Durch Anpassen der Schriftart können Sie das gesamte Widget nach Ihren Wünschen gestalten.

  • Launcher: Dies ist der Button, auf den Endbenutzer klicken können, um den Chat zu starten. Sie können nur das Symbol ändern oder den gesamten Button anpassen. Auch die Farben des Launchers lassen sich hier anpassen.

Klicken Sie unten auf Änderungen speichern.

Scherm­afbeelding 2025-07-01 om 09.33.32

Tab 3: Aufmerksamkeit erzeugen

Unter Ansprechen können Sie festlegen, wie Sie Besucher auf Ihren KI Agenten aufmerksam machen möchten. Dazu können Sie die folgenden Elemente personalisieren:

  • Willkommensbildschirm: Standardmäßig ist der Willkommensbildschirm aktiviert. Damit können Sie Ihre Kunden darauf hinweisen, dass sie mit dem Chat beginnen können. Wenn Sie es Ihren Kunden einfacher machen möchten, können Sie den Willkommensbildschirm deaktivieren – der Chat startet dann direkt.

  • Titel: Dies ist der Text, der im Willkommensbildschirm angezeigt wird.

  • Element zum Senden von Nachrichten: Dies ist der Text, der im ersten Bildschirm des Widgets angezeigt wird, bevor jemand tatsächlich den Chat startet. Sie können diesen Text sowohl für Gespräche mit dem KI Agenten als auch für Gespräche mit einem Mitarbeiter festlegen.

    Hier können Sie Titel, Untertext und den Text für den Button „Chat starten“ anpassen.
    Beispiel für den KI Agenten:

    • Titel: Wir sind für Sie da!

    • Untertext: Unser KI Agent ist rund um die Uhr für Ihre Fragen verfügbar

    • Start-Chat-Button: Chat starten

Scherm­afbeelding 2025-07-01 om 09.34.08

  • Chat geschlossen: Hier legen Sie fest, ob der Chat außerhalb der Geschäftszeiten geschlossen sein soll. Website-Besucher können dann weder mit dem KI Agenten noch mit einem Mitarbeiter chatten. Sie können dann auch die Texte festlegen, die im Widget außerhalb der Öffnungszeiten angezeigt werden.
    Beispiel:

    • Titel: Entschuldigung! Wir sind geschlossen

    • Untertext: Unsere Mitarbeiter sind von Montag bis Freitag von 9:00 bis 17:00 Uhr erreichbar

    • Start-Chat-Button: Jetzt chatten

  • Links auswählen: Hier können Sie angeben, über welche weiteren Kanäle Sie erreichbar sind. Dies sind nicht nur die Kanäle, die mit Watermelon verbunden sind, sondern z. B. auch eine E-Mail-Adresse, Telefonnummer oder die Seite mit häufig gestellten Fragen auf Ihrer Website.
    Sie können ein Symbol und einen Text wählen sowie die URL hinzufügen, auf die der Button verweisen soll.

Scherm­afbeelding 2025-07-01 om 09.35.20

Achtung! Beim Hinzufügen Ihrer WhatsApp-Nummer ersetzen Sie <number> durch Ihre eigene Telefonnummer.
Beispiel: https://wa.me/0612345678

Wenn Sie eine Ländervorwahl zu Ihrer Telefonnummer hinzufügen, müssen Sie ein +-Symbol verwenden.
Beispiel: +31 statt 0031

  • Eye-Catcher: Dies ist die Nachricht, die über dem Icon erscheint, wenn der Chat minimiert ist. Auf der rechten Seite können Sie unter Minimieren sehen, wie dies aussieht.
    Sie können den Eye-Catcher aktivieren oder deaktivieren und einen Text festlegen. Außerdem können Sie festlegen, dass der Eye-Catcher nicht auf Mobilgeräten angezeigt wird – dies ist empfehlenswert, wenn er Teile Ihrer Website verdecken würde.

  • Begrüßungsnachricht: Dies ist die Nachricht, die angezeigt wird, bevor der Chat gestartet wird. Unter Chat können Sie rechts sehen, wie sie aussieht.
    Sie können die Begrüßungsnachricht aktivieren oder deaktivieren und einen Text eingeben. Dieser Text kann fett, kursiv, mit Emojis oder Links formatiert werden.

  • Datenschutzbildschirm: Sie können einen Datenschutzbildschirm hinzufügen, in dem Sie den Endbenutzer um Zustimmung zu den Datenschutzrichtlinien bitten, bevor er den Chat startet.
    Dieser kann aktiviert oder deaktiviert werden, und Sie können den Titel, die Unterzeile und eine URL zu Ihrer Datenschutzseite einfügen.

  • Anhänge: Hier können Sie festlegen, ob Anhänge im Chat-Widget erlaubt sind.

  • Warteschlange: Wenn Weiterleiten aktiviert ist, kann es hilfreich sein, die Warteschlange zu aktivieren. So wissen Benutzer, wie lange sie ungefähr auf eine Antwort warten müssen.

  • URLs ausklappen: Hier können Sie festlegen, ob URLs im Chat automatisch ausgeklappt werden oder nicht.

  • Watermelon-Branding: Hier können Sie entscheiden, ob Sie das Watermelon-Branding ein- oder ausschalten möchten.

Klicken Sie unten auf Änderungen speichern.

Tab 4: Platzierung

Unter Platzierung legen Sie fest, wo das Widget auf Ihrer Website erscheinen soll und ob es automatisch geöffnet werden soll oder nicht.

  • Einmalig automatisch öffnen: Hier können Sie einstellen, ob sich das Chat-Widget beim ersten Besuch automatisch öffnen soll oder ob der Benutzer es manuell öffnen muss.
    Diese Einstellung kann separat für mobile Benutzer vorgenommen werden.

  • Position des Launchers: Hier können Sie auswählen, ob das Widget links oder rechts auf Ihrer Website angezeigt werden soll. Außerdem können Sie festlegen, wie viel Abstand das Widget vom Seitenrand und vom unteren Rand der Seite haben soll.

  • Code: Mit dem hier bereitgestellten Code können Sie das Widget an der gewünschten Stelle auf Ihrer Website einfügen.

Wie Sie das Chat-Widget auf Ihrer Website einbinden, erfahren Sie in diesem Artikel.

  • Websitebesucher verfolgen: Wenn Sie diese Option aktivieren, können Sie sehen, auf welcher Seite sich der Besucher befand, als er den Chat gestartet hat. Mehr dazu erfahren Sie in diesem Artikel.