Zum Hauptinhalt springen

Chat-Optik und Branding

Ein Chat, der den Eindruck erweckt, zum Shop zu gehören und nicht nur als nachträglich angebrachtes Widget zu fungieren, genießt das größere Vertrauen der Kunden, die gerade entscheiden, ob sie ihn nutzen möchten. Hier erfahren Sie, was Sie in der Admin-App unterDesignundEinstellungentatsächlich steuern können. Seiten.

Ausgehend von einer Stilvorlage

Drei integrierte Vorlagen bieten Ihnen einen guten Ausgangspunkt:Classic(einheitliche Hintergründe, Rahmen, Schatten – traditionell),Floaty(glasig, mit Umgebungslicht, transparente Elemente – modern) undBubbly Glow(abgerundet, im iOS-Stil, sanft Schimmernder Umriss mit einer Milchglasfüllung). Beim Wechseln der Vorlage wird ein passendes Standardsatzprofil für Schatten, Rahmen, Trennlinien und Eckenradien geladen, und Sie können diese Einstellungen anschließend weiterhin anpassen, ohne das Gesamtbild zu verlieren.

Farben

Benutzer-Nachrichtenfarbe (der Hintergrund der Nachrichten des Kunden) und Bot-Nachrichtenfarbe (die Antworten der KI), jeweils mit einer eigenen Textfarbe. Eine Primärfarbe, die auf Blockebene festgelegt ist, wird für Benutzernachrichten sowie für den Rahmen bzw. die Sprechblase des Containers verwendet. Farbe auf einer bestimmten Seite, wenn für diesen Block die Option „Benutzerdefinierte Einstellungen verwenden“ aktiviert ist. Darüber hinaus: Hintergrund des Containers, Rahmenfarbe und -breite, Schatten (Versatz, Weichzeichnung, Deckkraft) sowie Farbe und Dicke der Trennlinie zwischen den Nachrichten.

Form und Abstand

Radius des äußeren Containers, Radius der Chat-Sprechblase und Radius von Eingabefeldern/Buttons – alles ist möglich, von scharfen Ecken bis hin zu vollständig abgerundeten Kanten. Containerbreite, Padding und Rand. Maximale Chat-Höhe auf Desktop und Mobil, jeweils als Prozentsatz des Ansichtsfensters.

Die schwebende Blase

Der Chat wird immer als schwebende Blase mit fester Position dargestellt, die unten links oder unten rechts verankert ist – niemals inline und niemals in einer Seitenleiste. Sie steuern seine Position (links oder rechts), seine Größe in Pixeln sowie sein Symbol (Sternchen, Chat, Nachricht, Frage, Roboter oder Suche), seine Symbolfarbe und ob es überhaupt angezeigt wird. Siehe Chat-Position ierung & Layout für die Platzierung Anleitung.

Header, Anmeldebutton und Haftungsausschluss

Zeigt oder blendet die Chat-Headerleiste mit ihrer eigenen Textfarbe aus. Die Anmeldeaufforderung für Gäste anzeigen oder ausblenden. AI-Disclaimer-Text anzeigen oder ausblenden ("Dieser KI‑Assistent kann Fehler machen..."). Und zeigen Sie optional ein Profilbild – beispielsweise Ihr Logo – neben dem Bot an. Nachrichten, in der von Ihnen gewählten Größe.

Benutzerdefiniertes CSS

Globale Einstellungen umfassen ein Feld für benutzerdefiniertes CSS, das direkt in die Seite eingefügt wird. Unter Advanced Chat Styling finden Sie die benutzer definierten CSS-Eigenschaften und die DOM-Struktur, auf die Sie sicher abzielen können.

Sprache

Die Benutzeroberfläche des Widgets – Bildschirmbeschriftungen, Statusmeldungen der Tools, Kopfzeile und Haftungsausschluss – unterstützt drei Sprachen: Englisch, Deutsch und Niederländisch, wobei die jeweilige Sprache anhand der Inhalts­sprache Ihres Shops ermittelt wird. Dies ist keine automatische Übersetzung beliebiger Inhalte; Es handelt sich um eine festgelegte Sammlung übersetzter Zeichenfolgen. Siehe Mehrsprachige Unterstützung.

Nächste Schritte