Configurar Adaptive Cards

Puede usar Adaptive Cards para personalizar una ventana de chat. Los Adaptive Cards muestran información interactiva a los contactos. Permiten enviar mensajes con texto enriquecido y gráficos. También puede incluir controles de entrada y botones para recopilar comentarios de los usuarios que ven la tarjeta.

Adaptive Cards están disponibles para los canales de Live Chat Los Agentes y contactos interactúan en tiempo real. y Chat Messaging Chat asincrónico en el que los contactos envían un mensaje de conversación en cualquier momento y esperan una respuesta.. Actualmente, Adaptive Card se utilizan para la comunicación con los bots. Si los Adaptive Card no están habilitados para su sistema, aparece el texto alternativo. Comuníquese con su representante de cuenta para obtener ayuda para habilitar esta función.

Mostrar Adaptive Card en la Ventana de Chat

1. Haga clic en el selector de aplicaciones y seleccioneACD.

2. Vaya a Digital > puntos de contacto Digital.

3. Hacer clic Charla.

4. Haga clic en Personalización para el canal de chat que quiere configurar.

5. Desplácese hasta Personalización (CSS y JS) e ingrese el siguiente texto en el cuadro de texto CSS personalizado:

   
               button.ac-pushButton {

   color: #faac4b; 

   background: white;

   padding: 10px; 

   border: 1px solid; 

   border-radius: 10px; 

   cursor: pointer;

   }

6. Realice cambios y personalizaciones hasta que esté satisfecho con el formato y el aspecto de la Adaptive Card.

7. Ingrese el siguiente texto en el cuadro de texto JS personalizado:

   
       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. Hacer clicGuardar.

Después de agregar Adaptive Card a un chat, debe probarlas para asegurarse de que aparecen correctamente. Puede probarlas con Bot Builder o con la herramienta de prueba de Microsoft .