Anpassa widgetens utseende, beteende och funktionalitet genom konfigurationssystemet.
Alla widgetinställningar hanteras genom widgetkonfigurationen i din panel. Konfigurationen inkluderar utseendeinställningar, beteendealternativ och innehållsanpassning.
Tänk på konfigurationen som din widgets DNA—den definierar allt från färger och typsnitt till konversationsflöden och initiala meddelanden. Den bästa delen? Ändringar i din konfiguration träder i kraft omedelbart utan att kräva några kodändringar på din webbplats.
🎨 Live-anpassning
Använd vår visuella konfigurationsredigerare i panelen för att se dina ändringar i realtid. Ingen anledning att gissa hur färger kommer att se ut eller hur knappar kommer att bete sig—förhandsgranska allt innan publicering.
Visuellt utseende är avgörande för att få widgeten att kännas som en naturlig del av din webbplats. Våra utseendeinställningar ger dig fullständig kontroll över varje visuell aspekt.
Välj färger som matchar din varumärkesidentitet. Alla färgvärden bör vara i hex-format (t.ex. #FF5733).
Proffstips: Använd ett färgkontrastverktyg för att säkerställa att din text förblir läsbar mot dina valda bakgrunder. Detta är särskilt viktigt för tillgänglighetskrav.
Storlek på din widget lämpligt för ditt användningsfall och publik. Större dimensioner ger mer konversationskontext, medan mindre dimensioner känns mindre påträngande.
Mobilövervägande: Widgeten skalar automatiskt på mobila enheter, men testa din konfiguration på olika skärmstorlekar för att säkerställa en bra upplevelse för alla användare.
Beteendeinställningar styr hur widgeten interagerar med användare och svarar på olika sammanhang.
⚠️ Rekommendation
De flesta webbplatser bör börja med widgeten hopfälld (<code>start_open: false</code>) för att undvika att vara påträngande. Användare som behöver hjälp kommer naturligt att klicka på knappen. För dedikerade hjälp/supportsidor kan det vara fördelaktigt att starta öppen.
Hälsningsmeddelandet är det första användarna ser när de öppnar widgeten. Gör det välkomnande, tydligt och handlingsinriktat. Du kan inkludera interaktiva knappar för att vägleda användare till vanliga uppgifter.
Ett bra hälsningsmeddelande bör:
Exempel: "Hej där! 👋 Jag är här för att hjälpa till med frågor om våra produkter, prissättning eller konto. Hur kan jag hjälpa dig idag?"
<script src="https://widget.companin.tech/widget.js" data-widget-key="YOUR_WIDGET_KEY"></script>Konversationsflöden är fördefinierade vägar som vägleder användare genom vanliga scenarier. De är perfekta för FAQ, felsökning eller fler-stegsprocesser som returer eller bokningar.
Flöden utlöses av specifika nyckelord eller knapptryckningar. När de utlöses visar de en serie svar med valfria handlingsknappar, vilket skapar en guidad konversationsupplevelse utan att kräva AI-behandling.
Bästa praxis för flöden:
{ "flows": [ { "trigger": "/support", "responses": [ { "text": { "en": "How can we help?" }, "buttons": [ { "label": { "en": "Technical Support" }, "action": "/tech-support" } ] } ] } ]}Konfigurera text för flera språk:
Lägg till anpassad CSS för avancerad styling:
/* Anpassade widgetstilar */.companin-widget-container .custom-button { background: linear-gradient(45deg, #ff6b6b, #4ecdc4);}.companin-widget-container .message-bubble { border: 2px solid #ff6b6b;}Konfigurera externa API-ändpunkter för förbättrad funktionalitet: