Delen via


Een aangepaste live chat-widget ontwikkelen

Microsoft biedt een optie om een aangepaste live chatwidget te maken die u kunt koppelen aan uw Dynamics 365 Customer Service-account. Elk onderdeel van de aangepaste live chatwidget kan worden aangepast voor zowel functionaliteit als gebruikersinterface.

Afhankelijk van uw behoeften en resultaat kunt u de chatwidget aanpassen met een van de volgende opties:

  • Aanpasbare live chatwidget 2.0 gebruiken
  • Uw eigen widget ontwikkelen

Aanpasbare live chatwidget 2.0 gebruiken

Met de aanpasbare live chatwidget 2.0 kunt u alle elementen van de widget bewerken, zoals lettertype, kleuren en stijl, zodat u de widget kunt aanpassen aan uw merkafbeelding. De aangepaste widget helpt u vertrouwen en geloofwaardigheid te ontwikkelen, uw merk te onderscheiden, positieve emotionele verbindingen te bevorderen en de waarde te verhogen die klanten aan uw product toewijzen.

De nieuwe live chatwidget 2.0 is gebouwd op de Omnichannel Chat SDK en live chat widget UI Component Library.

Portalontwikkelaar: out-of-the-box gebruikersinterface aanpassen

Met de portalontwikkelaarsoptie kunt u de gebruikersinterface van de chatwidget aanpassen, maar worden de out-of-the-box-functionaliteitsinstellingen niet gewijzigd in het Copilot Service-beheercentrum. Als u dit wilt aanpassen, kunt u het script 'data-customization-callback' gebruiken waarmee de out-of-the-box-widget wordt verbonden met een JavaScript-functie. De functie kan CSS-stijlaanpassingen bevatten voor de chatonderdelen met dezelfde precedenten als de ui-onderdelenbibliotheek omnichannel Live Chat Widget.

Live chatwidgetscript bewerken om live chatwidget 2.0 in te schakelen

Als u de live chatwidget 2.0 en op scripts gebaseerde aanpassing wilt gebruiken, wijzigt u als volgt het codefragment van de out-of-the-box live chatwidget 2.0.

  1. Open in het Copilot Service-beheercentrum de chatwerkstroom en selecteer Live Chat Widget 2.0-script kopiëren om het codefragment te kopiëren.
  2. Maak een nieuwe JavaScript-functie met alle onderdelenstijl. Meer informatie: Omnichannel chatwidget
  3. Voeg 'v2' toe na het scriptkenmerk.
  4. Voeg 'data-customization-callback' toe en verwijs naar de JavaScript-functie.

Het bijgewerkte codefragment ziet er als volgt uit.

Een schermopname van de aangepaste live chatwidgetcode.

Een voorbeeldschermopname van een chatwidget 2.0 die is aangepast om de grootte ervan te vergroten, is als volgt.

Een voorbeeldschermopname van live chatwidget 2.0.

Bekijk de walkthroughvideo van de live chatwidget die is ingesteld.

De indeling van webafspraken gebruiken om de widget aan te passen

Met webbetrokkenheidsindeling kunt u uw configuratie-onderdrukkingen uit javaScript van uw pagina en naar het beheercentrum verplaatsen. Meer informatie vindt u in Chatwidgets implementeren op websites met één tag.

Uw eigen widget ontwikkelen

Gebruik de informatie in de volgende secties om uw eigen widget te bouwen.

Omnichannel Live Chat Widget UI Components-bibliotheek

De omnichannel Live Chat Widget UI Components-bibliotheek biedt een framework van herbruikbare React-onderdelen. De onderdelen worden gebouwd met behulp van de Fluent UI-bibliotheek. Meer informatie over de ui-onderdelenbibliotheek van Omnichannel Live Chat Widget.

Omnichannel Chat SDK

De Omnichannel Chat SDK is een opensource-pakket dat chatmethoden en -functies biedt om functionaliteit toe te voegen aan een live chatwidget. Meer informatie over de Omnichannel Chat SDK.

Uw live chatwidget aanpassen

Nadat u de nieuwste versie van de Omnichannel Chat SDK hebt geïnstalleerd, past u uw live chatwidget aan met behulp van Omnichannel Chat SDK-methoden en bewerkt u de basis CSS-stijlen van Omnichannel Live Chat Widget UI Components.

Opmerking

De Omnichannel Chat SDK is een vereiste voor het installeren van de Omnichannel Live Chat Widget UI Components-bibliotheek.

Live chatwidgets aanpassen voor mobiele apps
startChat
closeChat
lcw:sluitenChat
lcw:threadUpdate
lcw:chatOpgehaald
lcw:chatWachtrij