Assistent-Design-Konfiguration
Der Chat-Design -Tab ermöglicht es Ihnen, das visuelle Erscheinungsbild des Chat-Widgets vollständig anzupassen, um sicherzustellen, dass es sich nahtlos in das Branding Ihres Shops integriert.
Grundlegende Identität und Positionierung
Identität: Sie können den “Assistentennamen” (z. B. “KI-Assistent”) definieren, der in der Kopfzeile angezeigt wird, und optional eine “Assistenten-Avatar-URL” angeben, um ein benutzerdefiniertes Logo oder Bild neben dem Namen anzuzeigen.
Positionierung: Verwenden Sie das Dropdown-Menü „Position auf dem Bildschirm“, um auszuwählen, wo das Widget in Ihrem Shop angedockt wird (normalerweise unten rechts).
Layout und Abmessungen
Sie haben präzise Kontrolle über die physische Größe und Form der Chat-Oberfläche mithilfe von Pixel (px), Viewport-Höhe (vh) oder rem-Einheiten:
Passen Sie die allgemeine “Chat-Breite” (z. B. 400px) und die “maximale Chat-Höhe” (z. B. 50vh) an.
Optimieren Sie den Abstand mit “Nachrichtenauffüllung” und passen Sie die Krümmung der Oberfläche mit Radius-Steuerelementen wie “Nachrichtencontainer-Radius” (18px) und “Chatfenster-Radius” (12px) an.
Steuern Sie die Typografie-Größe mit Einstellungen für „Chat-Schriftgröße“, „Chat-Header-Textgröße“ und „Chat-Header-Symbolgröße“.
Farbthemen
Die Benutzeroberfläche bietet umfangreiche Hex-Code-Auswahlen, um jedes einzelne Element des Chat-Fensters anzupassen.
Hintergründe: Passen Sie den primären „Chat-Hintergrund“ (#FFFFFF), den „Hintergrund der Kundennachricht“ und den „Hintergrund der Assistentennachricht“ (#000000) an. Sie können auch bestimmte Bereiche wie den „Hintergrund des Willkommenstextbereichs“ oder die „FAQ-Hintergrundfarbe“ (#F9FAFB) einfärben.
Rahmen: Definieren Sie die dezenten Umrisse für das Nachrichtenfeld, FAQ-Boxen und Links, um ein einheitliches Erscheinungsbild zu schaffen.
Häufig gestellte Fragen
Der FAQ-Tab ermöglicht es Ihnen, vorformulierte Fragen zu erstellen, die angezeigt werden, bevor der Benutzer seine erste Nachricht eingibt. Dies hilft, häufige Anfragen sofort zu beantworten, ohne dass eine KI-Generierung erforderlich ist.
Klicken Sie auf „+ FAQ hinzufügen“, um einen neuen Eintrag zu erstellen.
Geben Sie für jeden Eintrag die übliche “Frage” ein (z. B. “Können Sie das Produkt in die USA versenden?”) und formatieren Sie die statische “Antwort” mit dem Rich-Text-Editor (fett, kursiv, unterstrichen, durchgestrichen).
Sie können die Fragen per Drag & Drop neu anordnen oder die Stift- und Papierkorb-Symbole verwenden, um sie zu bearbeiten oder zu löschen.
Schnellzugriffe
Der Tab „Links“ ermöglicht es Ihnen, direkte Navigationsschaltflächen am unteren Rand des Chat-Willkommensbildschirms hinzuzufügen. Dies ist ideal, um Benutzer zu alternativen Support-Kanälen oder wichtigen Shop-Seiten zu leiten.
Rasterlayout: Legen Sie zunächst fest, wie die Links angezeigt werden, indem Sie die Anzahl der “Rasterspalten” auswählen (z. B. werden sie bei Einstellung auf 3 in einer horizontalen Reihe angezeigt).
Links hinzufügen: Klicken Sie auf “+ Link hinzufügen”, um eine neue Schaltfläche zu erstellen. Geben Sie einen “Link-Titel” (wie “WhatsApp” oder “E-Mail”) an und geben Sie die genaue “Link-URL” ein (verwenden Sie Standardformate wie mailto: für E-Mails oder direkte Telefonnummern).
Symbole: Sie können aus einer integrierten Bibliothek mit Vektorsymbolen (wie einem Umschlag, Telefon, Globus oder Kalender) wählen, um den Link visuell darzustellen. Alternativ können Sie die Schaltfläche „Datei auswählen“ unter „Benutzerdefiniertes Bild“ verwenden, um Ihr eigenes Symbol hochzuladen.
Bereit, mehr auf Shopify zu verkaufen?
Installieren Sie Liliwi in Ihrem Shopify-Shop und erhalten Sie kostenloses Setup von unserem Team.
Nutzen Sie den vollen Service schon ab $1.