配置 Adaptive Card

您可以使用 Adaptive Card 来自定义聊天窗口。 Adaptive Card 向联系人显示交互信息。 它们可使您发送带有富文本和图形的消息。 您还可以添加输入控件和按钮来收集查看该卡的用户的反馈。

Adaptive Card 可用于实时聊天关闭 坐席和联系人实时交互和聊天消息关闭 异步聊天，联系人可随时发送聊天消息并等待回复渠道。 目前，Adaptive Card 用于机器人通信。 如果没有为您的系统启用 Adaptive Card，则会显示回退文本。 请联系您的 客户代表 以获取启用此功能的帮助。

在聊天窗口中显示 Adaptive Card

  1. 单击应用程序选择器 应用程序选择器的图标 并选择ACD。

  2. 转至 Digital > 数字联络点。

  3. 单击聊天。

  4. 单击想要配置的聊天渠道相应的自定义。

  5. 向下滚动到“自定义（CSS 和 JS）”，然后在自定义 CSS 文本框中输入以下文本：

    
            button.ac-pushButton {
    color: #faac4b; 
    background: white;
    padding: 10px; 
    border: 1px solid; 
    border-radius: 10px; 
    cursor: pointer;

    }

  6. 进行更改和自定义，直到您对 Adaptive Card 的格式和外观感到满意为止。

  7. 在自定义 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. 单击保存。

将 Adaptive Card 添加到聊天后，您必须对其进行测试，以确保它们正确显示。 您可以使用 Bot Builder 或 Microsoft 测试工具 一个方块，箭头从中心指向右上角。 来测试它们。