Utveckla anpassade livechattwidgetar

Microsoft tillhandahåller ett alternativ för att skapa en anpassad livechattwidget som du kan koppla till ditt Dynamics 365 Customer Service-konto. Varje komponent i den anpassade livechattwidgeten kan anpassas för både funktioner och användargränssnitt.

Beroende på dina krav och resultat kan du anpassa chattwidgeten med något av följande alternativ:

• Använda anpassningsbar livechattwidget 2.0
• Utveckla din egen widget

Använda anpassningsbar livechattwidget 2.0

Med den anpassningsbara livechattwidgeten 2.0 kan du redigera alla element i widgeten, till exempel teckensnitt, färger och formatering så att du kan matcha widgeten med din varumärkesbild. Den anpassade widgeten hjälper dig att odla förtroende och trovärdighet, särskilja ditt varumärke, främja positiva känslomässiga anslutningar och öka värdet som kunderna tillskriver din produkt.

Den nya live chat widget 2.0 bygger på Omnichannel Chat SDK och Live Chat Widget UI Component Library.

Portalutvecklare – Anpassa det färdiga skriptbaserade användargränssnittet

Med alternativet portalutvecklare kan du anpassa användargränssnittet för chattwidgeten men inte ändra de färdiga funktionsinställningarna i administrationscentret för Copilot-tjänsten. Om du vill anpassa kan du använda skriptet "data-customization-callback" som ansluter den färdiga widgeten till en JavaScript-funktion. Funktionen kan innehålla CSS-formatanpassningar till chattkomponenterna med samma prejudikat som Omnichannel Live Chat Widget UI Components-biblioteket.

Redigera widgetskript för livechatt för att aktivera livechattwidget 2.0

Om du vill använda livechattwidgeten 2.0 och skriptbaserad anpassning ändrar du kodfragmentet i den färdiga livechattwidgeten 2.0 på följande sätt.

1. I administrationscentret för Copilot-tjänsten öppnar du chattarbetsströmmen och väljer Kopiera livechattwidget 2.0 Skript för att kopiera kodfragmentet.
2. Skapa en ny JavaScript-funktion med all komponenters styling. Mer information: Chattwidget för Omnichannel
3. Lägg till "v2" efter skriptattributet.
4. Lägg till "data-customization-callback" och referera till JavaScript-funktionen.

Det uppdaterade kodfragmentet ser ut så här.

Ett exempel på en skärmbild av en chattwidget 2.0 som är anpassad för att öka dess storlek är följande.

Titta på genomgångsvideon av livechattwidgeten som har konfigurerats.

Använd webbengagemangens orkestrering för att anpassa widgeten

Genom orkestrering av webbinteraktion kan du flytta konfigurationsinställningar från JavaScript på din sida till administrationscentret. Läs mer i Distribuera chattwidgetar på webbplatser med en enda tagg.

Utveckla din egen widget

Använd informationen i följande avsnitt för att skapa en egen widget.

Omnichannel Live Chat Widget UI-komponentbibliotek

Omnichannel Live Chat Widget UI Components-biblioteket innehåller ett ramverk med återanvändbara React-komponenter. Komponenterna skapas med hjälp av Fluent UI-biblioteket. Läs mer om Omnichannel Live Chat Widget UI Components-biblioteket.

Omnichannel Chat SDK

Omnichannel Chat SDK är ett paket med öppen källkod som tillhandahåller chattmetoder och funktioner för att lägga till funktioner i en livechattwidget. Läs mer om Omnichannel Chat SDK.

Anpassa din livechatt-widget

När du har installerat den senaste versionen av Omnichannel Chat SDK anpassar du din livechattwidget med Omnichannel Chat SDK-metoder och genom att redigera de grundläggande CSS-formaten i Omnichannel Live Chat Widget UI Components.

Anmärkning

Omnichannel Chat SDK är en förutsättning för att installera Omnichannel Live Chat Widget UI Components-biblioteket.

Relaterad information

Anpassa livechattwidgetar för mobilappar
startchatt
closeChat
lcw:closeChat
lcw:trådUppdatering
lcw:chattHämtad
lcw:chattKöad