Tilpas webchat-udseende med Webchat Playground

Webchat Playground hjælper dig med at tilpasse udseendet og funktionsmåden af din agent Webchat. Den intuitive brugergrænseflade giver dig mulighed for at ændre farver, skrifttyper, miniaturer og meget mere, så de passer til dit brands identitet. I denne artikel beskrives det, hvordan du bruger Webchat Playground til at oprette og administrere temaer og eksportere typografier som JSON eller HTML.

Brugergrænsefladen til Webchat Playground

Webchat Playgrounds brugervenlige brugergrænseflade hjælper dig med at definere udseendet og følelsen af din Webchat. Du kan nemt foretage justeringer og se eksempler på dine ændringer i realtid.

Grænsefladen har tre hovedområder:

  1. I venstre rude vises gemte temaer med deres primære, sekundære og fremhævningsfarver. Vælg et tema for at redigere eller få vist et eksempel på det.

  2. Den midterste rude indeholder et eksempel på det valgte tema eller det tema, du redigerer.

  3. I højre rude kan du skifte mellem fanerne JSON og Kodestykke . JSON-visningen indeholder de aktuelle typografier i en JSON-matrix, som du kan indsætte i en eksisterende Webchat. Kodestykkevisningen indeholder HTML-eksempel på en webchat med de integrerede typografier.

Skærmbillede af brugergrænsefladen for Webchat Playground, der viser de tilgængelige temaer, indholdsruden og et JSON-kodestykke.

I dette eksempel på brugergrænsefladen vises:

  1. I ruden til venstre kan du se typografieditoren, hvor du redigerer eller opretter et tema.

    Afsnittene omfatter Generelt, Send boks, Forslagsboks, Avatar og Boble. Editoren indeholder også en tilgængelighedskontrol for alle relevante sektioner. Du gemmer og sletter handlinger øverst.

  2. I ruden til højre vises HTML-eksempel på fanen Kodestykke. Skift til fanen JSON for at se eksempel-JSON.

Skærmbillede af brugergrænsefladen for Webchat Playground, der viser tematypografieditoren, prøveversionsruden og fanen Kodestykke.

Brug foruddefinerede temaer, eller opret dine egne

Webchat Playground tilbyder foruddefinerede temaer, der viser forskellige tilpasningsmuligheder for webchatoplevelsen. Disse temaer giver dig et udgangspunkt, når du designer et nyt tema. Du kan også oprette nye temaer, der opfylder dine specifikke behov, og gemme dem til fremtidig brug.

Få vist et eksempel på et tema

Vælg et tema i venstre rude (hvor farverne vises) for at åbne Webchat Preview.

Oprette et nyt tema

Sådan opretter du et nyt tema:

  1. Vælg Tilføj et tema i venstre rude.
    Ruden til venstre bliver en typografieditor, hvor du kan foretage ændringer.
  2. Angiv et navn til temaet.
  3. Vælg Gem.

Redigere et tema

Sådan redigerer du et eksisterende tema:

  1. Vælg blyantsikonet ud for temanavnet i venstre rude.
  2. Foretag ændringer i typografieditoren.
  3. Når du er færdig, skal du vælge Gem.

Slette et tema

Sådan sletter du et eksisterende tema:

  1. Åbn temaet i redigeringstilstand.
  2. Vælg sletteikonet (papirkurv) øverst.

Eksportér stilarter

Sådan eksporterer du typografier:

  1. Vælg det ønskede tema i temavælgeren.
  2. Vælg fanen JSON i højre rude.
  3. Kopiér al teksten i visningen, og indsæt den i din Webchat HTML-kode ved hjælp af variablen styleOptions.

Eksportér HTML-kodestykket

Sådan eksporterer du HTML-kodestykket:

  1. Vælg det ønskede tema i temavælgeren.
  2. Vælg fanen Kodestykke i ruden til højre.
  3. Gem al HTML-markering i visningen som en fil med et .html filtypenavn.
  4. Overfør HTML-filen til webserveren.

HTML-eksempel

HTML-eksempelstykket indeholder et flydende kontrolelement til webchat med de valgte typografier anvendt.

Skærmbillede af den flydende webchatwidget med brugerdefinerede typografier anvendt.