Ein Live-Chat-Widget zur Website hinzufügen

Mit dem Live-Chat-Widget von Deskwoot können Ihre Website-Besucher Gespräche direkt von Ihrer Seite aus starten. Es lädt schnell, funktioniert reibungslos auf Desktop und Mobilgeräten und lässt sich an Ihre Marke anpassen. Im Folgenden finden Sie eine Schritt-für-Schritt-Anleitung zur Einrichtung des Widgets, Tipps, um das Beste daraus zu machen, und Antworten auf häufige Fragen.

Das Widget-Postfach erstellen

Gehen Sie zu Einstellungen > Postfächer > Postfach hinzufügen.
Wählen Sie Website als Kanaltyp.
Konfigurieren Sie die Widget-Einstellungen:
- Wählen Sie einen aussagekräftigen Namen für das Postfach (z. B. "Chat Hauptseite").
- Legen Sie Ihre Markenfarbe fest, damit das Widget zum Erscheinungsbild Ihrer Website passt.
- Schreiben Sie eine Begrüßungsnachricht, die Besucher beim Öffnen des Chats begrüßt.
- Wählen Sie die Position des Widgets, unten links oder unten rechts.
Klicken Sie auf Erstellen, um das Postfach zu speichern.

Das Widget installieren

Nachdem Sie das Postfach erstellt haben, generiert Deskwoot ein JavaScript-Snippet. So installieren Sie es:

Kopieren Sie das bereitgestellte Code-Snippet.
Fügen Sie es in den <head>-Bereich oder direkt vor dem schließenden </body>-Tag jeder Seite ein, auf der das Widget erscheinen soll.
Wenn Sie einen Tag-Manager wie Google Tag Manager nutzen, fügen Sie das Snippet stattdessen als Custom-HTML-Tag hinzu.

Öffnen Sie Ihre Seite nach der Bereitstellung in einem Inkognito-Fenster, um zu bestätigen, dass das Widget korrekt geladen wird.

Formulare vor dem Chat

Sie können verlangen, dass Besucher ihren Namen und ihre E-Mail-Adresse eingeben, bevor sie einen Chat starten. Aktivieren Sie dazu in den Postfach-Einstellungen das Formular, das vor dem Chat erscheint. So erkennen Sie wiederkehrende Kunden und können per E-Mail nachfassen, falls jemand geht, bevor Sie antworten. Wenn Sie Kontaktdaten gleich zu Beginn erfassen, sinkt zudem die Zahl der anonymen Gespräche, die Ihr Team bearbeiten muss.

Widget-Anpassung

Passen Sie das Erscheinungsbild des Widgets in den Postfach-Einstellungen an. Sie können Farbe, Position, Begrüßungstitel, Slogan und Begrüßungsnachricht ändern. Das Widget passt sich automatisch an mobile Bildschirme an, eine separate mobile Konfiguration ist also nicht nötig.

Tipps aus der Praxis

Halten Sie die Begrüßungsnachricht kurz. Ein oder zwei freundliche Sätze wirken besser als ein langer Absatz.
Passen Sie die Markenfarben an, um ein einheitliches Besuchererlebnis auf Ihrer gesamten Seite zu wahren.
Aktivieren Sie das Formular vor dem Chat, falls Ihr Team nicht in Echtzeit antworten kann. So können Sie per E-Mail nachfassen.
Testen Sie auf mehreren Geräten nach der Installation, um zu prüfen, ob das Widget auf Desktop- und mobilen Browsern korrekt angezeigt wird und funktioniert.

Fehlerbehebung

Widget erscheint nicht: Stellen Sie sicher, dass das JavaScript-Snippet korrekt platziert ist und keine Browser-Erweiterungen oder Werbeblocker das Laden verhindern. Leeren Sie Ihren Cache und versuchen Sie es in einem Inkognito-Fenster.
Stil-Konflikte: Falls das CSS Ihrer Website das Erscheinungsbild des Widgets stört, prüfen Sie auf globale Stile, die iframe- oder Button-Elemente überschreiben könnten.
Langsames Laden: Wenn Sie das Snippet direkt vor dem schließenden </body>-Tag platzieren, lädt das Widget nach Ihren Hauptinhalten und beeinträchtigt die Seitengeschwindigkeit kaum.

Häufig gestellte Fragen

Kann ich das Widget nur auf bestimmten Seiten einfügen?

Ja. Binden Sie das JavaScript-Snippet einfach auf den Seiten ein, auf denen das Widget erscheinen soll, und lassen Sie es auf den übrigen weg. Wenn Sie einen Tag-Manager nutzen, konfigurieren Sie einen Auslöser, der nur auf den gewünschten URLs greift.

Verlangsamt das Widget meine Website?

Das Widget ist so konzipiert, dass es asynchron lädt, daher sollte es Ihre Seitengeschwindigkeit nur minimal beeinflussen. Für optimale Leistung empfiehlt es sich, das Snippet vor dem schließenden </body>-Tag zu platzieren.

Kann ich das Widget auf Shopify oder WooCommerce nutzen?

Auf jeden Fall. Fügen Sie das Snippet in die Layout-Datei Ihres Themes ein. Bei Shopify verwenden Sie die Datei theme.liquid, bei WooCommerce die footer.php Ihres Themes oder ein Plugin für Header- und Footer-Skripte.