Adaptive Cards configureren

U kunt Adaptive Cards gebruiken om een chatvenster aan te passen. Adaptive Cards tonen interactieve informatie aan contacten. Hiermee kunt u berichten met rijke tekst en afbeeldingen verzenden. Aan deze kaarten kunt u ook besturingelementen voor invoer, en knoppen voor het verzamelen van feedback over de kaart toevoegen.

Adaptive Cards zijn beschikbaar voor de kanalen Live chat Een chatgesprek waarin agents en klanten in realtime communiceren. en Chat Messaging Een asynchrone chatfunctie, waarmee klanten op elk gewenst moment een chatbericht kunnen sturen en dan op een antwoord wachten.. Momenteel worden Adaptive Cards voor botcommunicatie gebruikt. Als Adaptive Cards niet voor uw systeem zijn ingeschakeld, wordt de fallback-tekst weergegeven. Neem contact op met uw Accountmanager voor assistentie bij het inschakelen van deze optie.

Adaptive Cards in chatvenster weergeven

1. Klik op de app-kiezer en selecteerACD.

2. Ga naar Digital > Digitale contactpunten.

3. Klik op Chat.

4. Klik op Aanpassing voor het chatkanaal dat u wilt configureren.

5. Blader omlaag naar Aanpassing (CSS en JS) en typ de volgende tekst in het tekstvak Aangepaste CSS:

   
               button.ac-pushButton {

   color: #faac4b; 

   background: white;

   padding: 10px; 

   border: 1px solid; 

   border-radius: 10px; 

   cursor: pointer;

   }

6. Pas de Adaptive Card aan tot de indeling en het uiterlijk ervan naar wens zijn.

7. Typ de volgende tekst in het tekstvak Aangepaste JS:

   
       window.addEventListener('load', function() {

   if (!window.MutationObserver) {

   return;

   }

   var iframeObserver = new MutationObserver(function(){

   var button = document.querySelector('.ac-pushButton');

   if (button) {

   button.onclick = function () {

   alert('roshan');

   };

   }

   });

   iframeObserver.observe(document.body, {

   attributes: true,

   subtree: true,

   childList: false,

   characterData: false

   });

   });

8. Klik op Opslaan.

Nadat u Adaptive Cards aan een chat hebt toegevoegd, moet u deze testen om te verifiëren of ze goed worden weergegeven. U kunt ze testen met Bot Builder of de Microsoft-testtool .