Tema & Utseende
Sidan Tema är där du ger din assistent dess visuella identitet — namn, avatar, varumärkesfärger — och väljer de kanaler där den kommer att finnas. Allt förhandsgranskas live på sidan, så du kan iterera utan att lämna instrumentpanelen.
Få din AI-agent att SE ut som varumärket · Tema + GDPR-widget
→ Administratörsväg: Anpassning → Tema (/admin/chatModel/{id}/settings/theme)
Vad du konfigurerar
Sidan är organiserad i tre steg. Du kan gå framåt och bakåt när som helst; ändringar i steg 2 sparas när du trycker på Spara & Nästa.
Steg 1 — Identitet
- Namn — det offentliga namnet på din assistent (t.ex. "Emma", "Support Bot"). Synligt överallt där din assistent pratar med användare.
- Avatar — bilden som användare ser i chattens rubrik och meddelandebubblor. Ladda upp en fyrkantig bild; vi ändrar storlek och levererar den från vårt CDN.
Namnet är vad dina användare kallar boten. Välj något som passar varumärket och är lätt att skriva — det blir assistentens identitet över varje kanal.
Steg 2 — Färger
Två färger definierar hela widgetpaletten:
| Färg | Var den visas |
|---|---|
Primär (brand.200) | Bakgrund för den flytande knappen, accentf ärger för meddelandebubblor, hover-tillstånd |
Sekundär (brand.500) | Skicka-knapp, länkar i konversationen, fokusringar, aktiva tillstånd |
Båda inmatningarna accepterar vilket HEX-värde som helst. Den live förhandsgranskningen längst ner på sidan återspeglar dina ändringar i realtid så att du kan välja ett par som ser bra ut på din webbplats innan du sparar.
Varför bara två färger? Vårt designsystem härleder en full 5-stegs palett (100/200/500/700/900) från dessa två ankare. Du sätter tonen; vi håller resten konsekvent.
Steg 3 — Integrera
När din assistent ser bra ut, hoppa direkt till den integrationskanal du väljer:
- Webbwidget — inbäddningskod för vilken webbplats som helst, med fulla kontroller för knappar och layout
- WordPress — automatisk injektion via WordPress-pluginet
- PrestaShop — automatisk injektion via PrestaShop-modulen
- Shopify — koppla din butik och injicera chatboten automatiskt
- Joomla — automatisk injektion via Joomla-pluginet
Varje kort tar dig till den dedikerade integrationssidan där du justerar knappstil, position, feedbackläge, röstfunktioner och kanal-specifikt beteende.
Live förhandsgranskning
Ett live chattwidget renderas på Tema-sidan själv. Det injiceras automatiskt varje gång du ändrar en färg, så du ser den exakta rendering som dina slutanvändare kommer att få — ingen anledning att publicera eller öppna en annan flik.
Förhandsgranskningen använder samma universal-chatbot.js-paket som produktionen, så vad du ser är vad dina besökare kommer att se.
Behörigheter
| Åtgärd | Krävd behörighet |
|---|---|
| Visa Tema-sidan | THEME_READ |
| Ändra färger / spara tema | THEME_UPDATE |
| Byta namn på assistenten | CHAT_MODEL_UPDATE |
Medlemmar utan THEME_UPDATE ser sidan i skrivskyddat läge (inmatningar inaktiverade, ingen Spara-knapp). Se Åtkomstkontroll för hur man tilldelar dessa.
Tips
- Testa på din verkliga bakgrund. Öppna din webbplats i en andra flik medan du väljer färger — vad som ser bra ut i instrumentpanelen kan krocka med din hero-sektion.
- Behåll kontrasten. Den sekundära färgen används också för klickbar text i konversationen. Om användarna inte kan läsa den, kommer de inte att klicka.
- Matcha din CTA, inte din logotyp. Widgeten är en interaktiv yta, så ankra den till handlingsfärgen på din webbplats (den "Köp nu" / "Registrera dig" tonen) snarare än din logotypfärg.
- Avataren spelar större roll än du tror. Ett riktigt ansikte eller en stiliserad karaktär konverterar bättre än en generisk robotikon — användare öppnar chatten mer när den ser mänsklig ut.
Relaterat
- Biografi — definiera din assistents personlighet och beslutsregler
- Integrera Chatboten — inbädda den på en webbplats
- Kanaler — koppla meddelandeplattformar
- Åtkomstkontroll — hantera vem som kan redigera temat