Das Widget auf dem Handy: ein Button, der nicht stört

Mehr als die Hälfte der Anfragen kommt vom Handy. Dort hat der Chat genau eine Chance, nicht zum Ärgernis zu werden.

Am Desktop sitzt der Chat-Button in einer leeren Ecke und stört niemanden. Auf dem Handy ist dieselbe Ecke von „Kaufen“, dem Warenkorb, dem Cookie-Banner und manchmal einer Telefonnummer belegt. Deshalb wird das mobile Widget getrennt eingerichtet — sonst verdeckt es genau das, wofür der Besucher gekommen ist.

Position und Abstände

In den Website-Einstellungen stehen die Seite (links oder rechts) sowie die Abstände in X und Y. Die Regel ist einfach: Der Button darf die Aktion nicht verdecken, die Geld bringt. Steht unten rechts „In den Warenkorb“, wandert der Chat nach links oder 70–80 Pixel nach oben. Prüfen Sie das an einem echten Gerät, nicht im Emulator — zwei Zentimeter auf dem Bildschirm entscheiden alles.

Wo der Button besser verschwindet

Das Feld Visibility rules (JSON) steuert, wo das Widget überhaupt erscheint. Das Format ist schlicht: {"include":["/pricing"],"exclude":["/admin"],"desktop":true,"mobile":false}. Der typische Fall: den Chat auf der Kassenseite mobil ausblenden, damit er nicht mit dem Bezahlformular konkurriert, und ihn auf Produkt- und Preisseiten lassen, wo die Fragen entstehen.

Tempo vor Schönheit

Das Widget wird mit einer Zeile eingebunden und lädt asynchron: Die Seite wartet nicht auf es. Das Aussehen kommt als eigene Datei, deshalb braucht eine strenge Content-Security-Policy auf der Kundenseite kein unsafe-inline — es genügt, die Widget-Domain in script-src, style-src und connect-src zu erlauben.

Die Sprache passt sich selbst an

Die Sprache kommt aus dem Attribut data-lang, dann aus <html lang> der Seite, dann aus dem Browser; unterstützt werden Englisch, Polnisch, Deutsch und Russisch. Auf einer mehrsprachigen Website ist nichts weiter zu tun: Die deutsche Seitenversion öffnet ein deutsches Widget.

Aktive Einladung — sparsam

Die aufklappende Einladung („Kann ich etwas erklären?“) wirkt auf Preis- und Katalogseiten gut und nervt auf der Bezahlseite. Darum hat sie eine Verzögerung und eine eigene Seitenliste: Zeigen Sie sie dort, wo Menschen auswählen, und schweigen Sie dort, wo sie schon bezahlen.

Prüfen nach der Einrichtung

Laden Sie die Seite nach jeder Änderung neu — das Widget gleicht sich mit dem Server ab und holt den frischen Build. Gehen Sie dann mit dem Handy wie ein gewöhnlicher Besucher durch die Website: Katalog, Produkt, Warenkorb. Verdeckt der Button nirgends etwas Wichtiges und öffnet sich der Chat beim ersten Tippen, ist die Einrichtung fertig.

Tastatur und Bildschirmhöhe

Auf dem Handy teilt sich das Chatfenster den Bildschirm mit der Tastatur: Übrig bleibt ein Streifen von wenigen Zeilen. Lange Begrüßungen und Fragen über drei Absätze werden dort schlicht nicht gesehen. Halten Sie die erste Nachricht auf ein bis zwei Zeilen und fragen Sie einzeln nach.

Ein Foto statt einer Beschreibung

Ein Kunde am Handy kann fast immer ein Foto schicken — beschädigte Ware, den Bildschirm einer fehlgeschlagenen Zahlung, das Etikett mit der Artikelnummer. Die Datei erreicht den Operator in Telegram, und ein solches Bild ersetzt drei Runden Nachfragen. Es lohnt sich, direkt darum zu bitten: „Schicken Sie ein Foto, das geht schneller.“

← Alle Artikel