Udseende-indstillinger styrer, hvordan din chatbots chatwidget ser ud for besøgende på dit website - overskriften, farver og skrifttyper i beskeder, startikonet, velkomstskærmen, widgetstørrelsen og meget mere. Det er her, du får widgetten til at matche dit brand.
Du skal have en chatbot, før du kan tilpasse dens udseende. Hvis du ikke har oprettet en endnu, kan du starte med Sådan opretter du din første chatbot.
Hvor finder du udseende-indstillingerne?
Vælg din chatbot, og gå til Settings > Appearance (Indstillinger > Udseende). Fra hovedsiden i ChatLab klikker du på Chatbots, åbner din chatbot, vælger fanen Settings (Indstillinger) og klikker derefter på Appearance (Udseende) i venstre menu.
En live-forhåndsvisning af din widget vises i højre side af siden og opdateres i takt med, at du ændrer indstillingerne.
Chat Header
Konfigurer, hvordan den øverste del af din chatwidget ser ud:
- Chatbot name (Chatbot-navn) - det viste navn i chatoverskriften (maks. 60 tegn)
- Tagline (Undertitel) - valgfri undertitel, der vises under chatbottens navn (maks. 60 tegn)
- Avatar - upload et brugerdefineret billede, som kunderne ser, mens de chatter med chatbotten. Brug knappen Remove (Fjern, fremhævet nedenfor) til at fjerne det aktuelle billede.
- Background (Baggrund) - baggrundsfarve for overskriftsområdet
- Name color (Navnefarve) - tekstfarve for chatbottens navn
- Tagline color (Undertitelfarve) - tekstfarve for undertitlen
- Reset conversation tooltip (Værktøjstip til nulstilling af samtale) - tekst på værktøjstippet, der vises, når besøgende holder musen over knappen til at nulstille samtalen i widgetoverskriften (maks. 40 tegn, standard "Reset conversation")
Message
Tilpas beskedfeltet og udseendet af samtalebeskederne:
- Input placeholder (Pladsholder i indtastningsfelt) - pladsholdertekst, der vises i feltet til nye beskeder i bunden af widgetten (maks. 50 tegn, standard "Type a message..."). Brug den til at opfordre besøgende til at begynde at skrive.
- User background (Brugerbaggrund) - baggrundsfarve for beskeder sendt af den besøgende
- User text (Brugertekst) - tekstfarve for den besøgendes beskeder
- Resp. background (Svarbaggrund) - baggrundsfarve for chatbottens svar
- Response text (Svartekst) - tekstfarve for chatbottens svar
Beskedernes tekststørrelse indstilles i sektionen Typography sammen med skrifttypen for widgetten.
Suggested Questions
Foreslåede spørgsmål er færdige forslag, som en besøgende kan trykke på for at starte en samtale. Selve spørgsmålene skriver du under Settings > Chat Conversation (Indstillinger > Chatsamtale); her tilpasser du knappernes udseende:
- Background (Baggrund) - baggrundsfarve for knapper med foreslåede spørgsmål
- Text (Tekst) - tekstfarve for knapper med foreslåede spørgsmål
- Stack (Stabl) - når denne funktion er aktiveret, stables længere foreslåede spørgsmål lodret i stedet for at vise en vandret rullebjælke
Tekststørrelsen for foreslåede spørgsmål indstilles i sektionen Typography.
Minimized-Mode Settings
Styr, hvordan chatwidgetten ser ud i minimeret tilstand (før den besøgende åbner chatten):
- Minimized display mode (Minimeret visningstilstand) - vælg mellem:
- Icon (Ikon) - standard rundt chatikon til start (standard)
- Minified chat bar (Minimeret chatlinje) - kompakt tekstfelt, der vises i bunden af siden
- Icon with text (Ikon med tekst) - en bredere pilleformet startknap: ikonet plus en kort tekst på to linjer
- Icon color / Mini bar color (Ikonfarve / Minilinjefarve) - farve på startikonet eller baggrunden på minilinjen
- Custom chat icon (Brugerdefineret chatikon, kun ikontilstand) - aktiver for at uploade brugerdefinerede ikoner for åbn/luk chat
- Position on screen (Position på skærmen) - placer widgetten i venstre eller højre side af skærmen
- Move up chat icon/bar by (Flyt chatikon/-linje op med) - lodret forskydning i pixels fra den nederste kant
- Move icon/bar left/right by (Flyt ikon/linje til venstre/højre med) - vandret forskydning i pixels fra den nærmeste skærmkant
Icon with Text
Tilstanden Icon with text giver startknappen en kort tekst, så besøgende kan se, hvad chatten er til, før de åbner den. Det er nyttigt, når et rent ikon ikke er tydeligt nok - for eksempel "Skriv til os / Vi svarer med det samme" eller "Brug for hjælp? / Spørg vores assistent".
Når du vælger denne tilstand, tilføjes fire indstillinger:
- Label line 1 (Tekstlinje 1) - den første, fremhævede linje i teksten (maks. 60 tegn)
- Label line 2 (Tekstlinje 2) - den anden, mere afdæmpede linje (maks. 60 tegn). Lad feltet stå tomt, hvis du vil have en startknap med en enkelt linje
- Text color (Tekstfarve) - farven på teksten. Hvis du lader den stå uændret, vælger ChatLab automatisk sort eller hvid ud fra, hvor lys eller mørk din startknaps farve er
- Show close cross (Vis lukkekryds) - tilføjer et lille kryds på startknappen, så besøgende kan skjule den
Begge linjer afkortes med en ellipse (...), hvis der ikke er plads nok, så startknappen aldrig bliver bredere end skærmen. Startknappen trækker sig sammen til en cirkel igen, mens chatten er åben.
Hvis understøttelse af flere sprog er aktiveret, oversættes begge tekstlinjer på samme måde som resten af de tekster, der vender ud mod den besøgende.
Show close cross er slået fra som standard og er kun tilgængelig i denne tilstand. Når den er aktiveret, kan en besøgende klikke på krydset for at skjule startknappen i resten af deres session - den forbliver skjult, mens de bevæger sig mellem sider, og dukker først op igen ved næste besøg eller i en ny fane. En chatbot, der er sat til at åbne automatisk, respekterer dette valg og åbner ikke igen, efter den besøgende har lukket den.
Auto Open Chat Widget After Page Load
Konfigurer chatten til automatisk at folde sig ud, når besøgende indlæser siden:
- Auto open on mobile (Åbn automatisk på mobil) - åbner automatisk chatten på mobile enheder
- Auto open on desktop (Åbn automatisk på computer) - åbner automatisk chatten på computerskærme
- Open chat with delay (Åbn chat med forsinkelse) - aktiverer en forsinkelse før automatisk åbning (kun tilgængelig, når automatisk åbning er aktiveret)
- Delay by (Forsink med) - antal sekunder, der ventes, før chatten åbner (0-60 sekunder)
Human-Like Messaging
Simulerer en menneskelignende indtastning ved at opdele svar i flere beskedbobler, som vises gradvist sætning for sætning:
- Human-Like Messaging - slå funktionen til eller fra
- Delay Between Bubbles (Forsinkelse mellem bobler) - tid i sekunder mellem visning af hver beskedboble (0-200 sekunder)
Welcome Message Bubble
Vis velkomstbeskeden i en boble over chatikonet for at hjælpe besøgende med at få øje på chatten. Denne funktion er kun tilgængelig i ikontilstand og fungerer ikke i iframe-tilstand, eller hvis automatisk åbning er aktiveret.
- Show on desktop (Vis på computer) - vis velkomstboblen på computeren
- Show on mobile (Vis på mobil) - vis velkomstboblen på mobile enheder
- Delay (Forsinkelse) - antal sekunder efter sideindlæsning, før boblen vises (0-60 sekunder)
Hvis du har flere velkomstbeskeder, stables de over chatikonet.
Stemmestyret indtastning (mikrofonknappen i beskedfeltet) konfigureres i Settings > Chat Conversation, ikke her under Appearance.
Welcome Screen
Skift widgetten til et særligt startlayout, der byder nye besøgende velkommen med en stor velkomstbesked og de foreslåede spørgsmål stablet på et centreret hvidt kort. Velkomstskærmen vises kun i starten af en ny session og skifter til den almindelige chatvisning, så snart den besøgende sender sin første besked.
- Special Welcome Screen (Særlig velkomstskærm) - slår velkomstskærmtilstanden til eller fra (slået fra som standard)
- Suggested questions intro (Intro til foreslåede spørgsmål) - kort tekst, der vises over kortet med foreslåede spørgsmål på velkomstskærmen (for eksempel "Vælg en mulighed, eller skriv en besked"). Lad feltet stå tomt for at skjule teksten. Kræver, at foreslåede spørgsmål er konfigureret i Settings > Chat Conversation.
- Hide Human Contact Form (Skjul kontaktformular til mennesker) - skjuler handlingen for kontaktformularen i overskriften, mens velkomstskærmen vises
- Hide Live Chat (Skjul Live Chat) - skjuler livechat-handlingen i overskriften, mens velkomstskærmen vises
Velkomstskærmen integrerer også med Lead Collection og Privacy Policy consent (Samtykke til privatlivspolitik) - hvis en af delene kræves ved samtalens start, vises formularen eller samtykketeksten på velkomstkortet i stedet for de foreslåede spørgsmål.
Du kan læse mere om detaljer, layoutvarianter og se skærmbilleder af brugerfladen i Velkomstskærm.
Header Actions
Styrer, hvordan Live Chat og Human Contact Form (kontaktformular til mennesker) præsenteres i chatwidgettens overskrift.
- Separate icons (Separate ikoner) - hver handling får sit eget ikon i overskriften ved siden af lukkeknappen
- Menu (dropdown) (Menu (rullemenu)) - begge handlinger flyttes ind i overskriftsmenuen (ikonet med tre prikker) sammen med elementer som "Reset conversation" og sprogvælgeren, når disse er slået til
Nye chatbots bruger menuen, hvilket forhindrer, at overskriften bliver rodet, efterhånden som der tilføjes flere handlinger. Chatbots oprettet før 2. september 2026 beholder separate ikoner, så intet ændrer sig for deres besøgende. Du kan skifte når som helst - indstillingen påvirker kun præsentationen, ikke hvad handlingerne gør.
Typography
Angiver skrifttype og tekststørrelser for hele widgetten - beskeder, foreslåede spørgsmål, overskrift, formularer og teksten på startknappen.
- Widget font (Widgetskrifttype) - en ud af otte skrifttyper: System default, Inter, Nunito, Lato, Montserrat, Poppins, Source Serif og JetBrains Mono
- Message font size (Skriftstørrelse for beskeder) - størrelsen på beskedtekst (12-24 px)
- Suggested questions font size (Skriftstørrelse for foreslåede spørgsmål) - størrelsen på knapperne med foreslåede spørgsmål (12-24 px)
Inter er standard og svarer til, hvordan alle chatbots så ud, før denne indstilling blev introduceret, så intet ændrer sig, før du vælger en anden skrifttype.
System default henter slet ingenting - widgetten bruger den skrifttype, der allerede er installeret på den besøgendes enhed. Det gør det til den hurtigste mulighed, og den passer godt ind på sider, der selv anvender systemets standardskrifttype, men chatten vil se en smule forskellig ud på Windows, macOS og Android. De øvrige syv er Google Fonts, som hentes én gang af den besøgendes browser. Hver enkelt har en reserveløsning (fallback), så teksten forbliver læselig og layoutet intakt, selvom en besøgendes netværk blokerer Google Fonts.
Skrifttypefilen hentes direkte ind i selve chatvinduet. Den tilføjes kun til din egen side, når widgetten viser tekst uden for chatvinduet - startknappen Icon with text, den minimerede chatlinje eller velkomstbeskedbobler. En chatbot, der bruger det almindelige startikon, tilføjer ingen ekstra forespørgsler til din side.
Widget Size
Juster, hvor stor den åbne chatwidget skal være på computer og mobile enheder. Hver skyder har en Default-knap (Standard), som gendanner de indbyggede størrelser.
- Desktop width (Computerbredde) - widgetbredde på computerbrowsere i pixels (330-800, standard 448)
- Desktop height (Computerhøjde) - widgethøjde på computerbrowsere i pixels (300-770, standard 660)
- Mobile size (Mobilstørrelse) - widgetstørrelse på mobile enheder i procent af skærmen (60-100%, standard 100%)
Ved standardværdien bruger widgetten ChatLabs indbyggede responsive dimensionering. Enhver anden værdi anvender en fast størrelse.
På mobilen får standardværdien (100%) den åbne chat til at dække hele skærmen. Hvis du vælger en lavere procentdel, formindskes widgetten til den del af skærmen og centreres i visningsfeltet, så de besøgende stadig kan se siden rundt om chatten.
Ved siden af skyderne finder du to Save & Preview-knapper (Gem og forhåndsvis, fremhævet nedenfor) - én for computerrækkerne og én for mobilrækken. Når du klikker på en knap, gemmes eventuelle ugemte ændringer, og chatten åbnes i et forhåndsvisningsvindue med dine aktuelle indstillinger:
- Computerknappen åbner et almindeligt browservindue, så du kan se den nøjagtige størrelse på en computerskærm.
- Mobilknappen åbner et kompakt pop op-vindue (400 x 700), så widgetten gengives i sit mobillayout, hvilket er praktisk, når du justerer skyderen Mobile size fra en computer.
Maximise Button (Drawer Mode)
Drawer mode (Skuffetilstand) lader den besøgende skifte chatten fra et svævende vindue til et panel i fuld højde, der er fastgjort til kanten af skærmen, mens din side stadig er synlig ved siden af. Det er velegnet til samtaler, som den besøgende bruger, mens vedkommende læser siden - lange svar, produktsammenligninger, formularer eller andet med meget tekst.
Aktiver Maximise button (Maksimer-knap) under Widget Size, hvorefter der vises en knap i chatoverskriften; den besøgende bestemmer selv, om den skal bruges. Valget huskes i resten af browsersessionen.
- Panelet fylder halvdelen af browservinduet i bredden, op til 720 px, og altid fuld højde. Det fastgøres i samme side som din startknap, så en widget placeret til venstre åbner et panel i venstre side.
- Desktop width og Desktop height gælder ikke her - de styrer kun størrelsen på det almindelige svævende vindue.
- Knappen vises kun på computerskærme, der er mindst 1200 px brede, med en mus. På telefoner og tablets vises den aldrig, da chatten allerede fylder hele skærmen der. Hvis en besøgende gør browseren mindre end denne bredde, foldes panelet tilbage til det normale vindue.
- Startknappen er skjult, mens panelet er åbent; den besøgende lukker det fra overskriften eller forlader skuffetilstanden med den samme knap.
Skuffetilstand er slået fra som standard, så intet ændrer sig for dine besøgende, før du aktiverer den.
Andre udseende-indstillinger
- Widget Shadow (Widgetskygge) - slå en skygge omkring chatwidgettens ramme til eller fra
- Open links in (Åbn links i) - vælg, om links i chatbeskeder skal åbne i en ny fane (new tab) eller i samme fane (same tab)
Der vises også en lukkeknap (X) i chatoverskriften på computere, så besøgende kan minimere chatten tilbage til startikonet uden at genindlæse siden. Lukkeknappen forbliver skjult, når chatten er integreret som en iframe eller i fuldskærmstilstand.
Custom Chat Footer
Tilføj en brugerdefineret tekst, der vises i bunden af chatwidgetten (maks. 250 tegn). Markdown understøttes til indsættelse af links. En almindelig anvendelse er at linke til din privatlivspolitik eller dine handelsbetingelser.
Eksempel på markdown:
By chatting you accept our [Privacy Policy](https://www.example.com)
Custom CSS
Tilføj brugerdefinerede CSS-stile for at tilpasse udseendet af din chatwidget yderligere (maks. 5000 tegn):
Relaterede artikler
Ændringer gemmes automatisk. Vent på Saved (Gemt), og tjek derefter Overview (Oversigt) og den integrerede widget på computer og mobil. Indstillingsvisningen viser chatvinduet; placeringen af startikonet og automatisk åbning på sideniveau bør også kontrolleres på din website-integration.
- Sådan opretter du din første chatbot
- Samtaleindstillinger - skriv velkomstbeskeden og de foreslåede spørgsmål
- Velkomstskærm - startlayoutet i fuld skærm og dets varianter på brugersiden
- Brugerdefinerede formularer - indsaml oplysninger om besøgende direkte i chatten
- Lead-indsamling