Habilitar a formatação de texto para a experiência de chat do cliente

Com a formatação de mensagens do Amazon Connect, você pode permitir que seus clientes e atendentes adicionem rapidamente estrutura e clareza às mensagens de chat.

Tipos de formatação compatíveis

Você pode fornecer os seguintes tipos de formatação na interface do usuário do chat e na aplicação do atendente usando markdown:

• Negrito

• Itálico

• Lista com marcadores

• Lista numerada

• Hiperlinks

• Emoji

• Anexos. Para habilitar os anexos, siga Habilitar anexos para compartilhar arquivos usando o chat e fazer upload de arquivos para casos.

Como habilitar formatação de mensagens

1. Quando você cria uma nova interface de usuário de chat, a formatação rich text é habilitada imediatamente. Não é exigida nenhuma configuração adicional.

2. Para adicionar recursos de formatação de texto a uma interface de usuário de chat existente, atualize o código do widget de comunicação com o seguinte código destacado em negrito:

   
       (function(w, d, x, id){
           s=d.createElement('script');
           s.src='https://d3xxxx.cloudfront.net/amazon-connect-chat-interface-client.js';
           s.async=1;
           s.id=id;
           d.getElementsByTagName('head')[0].appendChild(s);
           w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
       })(window, document, 'amazon_connect', 'widget-id');
       amazon_connect('styles', { openChat: { color: 'white', backgroundColor: '#123456'}, closeChat: { color: 'white', backgroundColor: '#123456'} });
       amazon_connect('snippetId', 'snippet-id');
       amazon_connect('supportedMessagingContentTypes', [ 'text/plain', 'text/markdown' ]);
                   

   O código destacado em vermelho é definido com os valores corretos quando você recebe o snippet no console do Amazon Connect. O único conteúdo que você escolhe adicionar ou remover é a última linha em negrito parasupportedMessagingContentTypes.

3. Para adicionar recursos de formatação de texto à sua própria interface de usuário de chat personalizada (por exemplo, Interface de chat ou sua própria solução de interface de usuário sobre o ChatJS), siga estas etapas:

   1. Chame a API de StartChatcontato. Ao chamar StartChatContact, adicione o parâmetro SupportedMessagingContentTypes conforme mostrado em negrito no exemplo a seguir:

      // Amazon Connect StartChatContact API
      {
          "Attributes": { 
              "string" : "string" 
          },
          "ClientToken": "string",
          "ContactFlowId": "your flow ID",
          "InitialMessage": { 
              "Content": "string",
              "ContentType": "string"
          },
          "InstanceId": "your instance ID",
          "ParticipantDetails": { 
              "DisplayName": "string"
          }
          
          // optional
         "SupportedMessagingContentTypes": [ "text/plain", "text/markdown" ]
      }

   2. Importe chatjs como objeto, conforme mostrado no exemplo a seguir:

      import "amazon-connect-chatjs";
      
      this.session = connect.ChatSession.create({
            ...
          });
      
      this.session.sendMessage({
            message: "message-in-markdown-format",
            contentType: "text/markdown"
      });           

      Se você não usa ChatJs, consulte estes tópicos para obter informações sobre o envio de texto de marcação por meio das APIs do Amazon Connect: StartChatEntre em contato e. SendMessage

   3. Envie mensagens com markdown. Consulte o snippet de código anterior para importar chatjs como objeto para ver um exemplo de como enviar mensagens. Você pode usar o markdown simples para formatar texto em chats. Se você já usa o chatjs hoje para enviar mensagens de texto simples, você pode modificar sua lógica existente para chamar SendMessagecom text/markdown as contentType em vez de text/plain quando quiser enviar mensagens de markdown. Atualize o parâmetro sendMessage para ter o formato markdown de suas mensagens. Para obter mais informações, consulte Markdown Guide Basic Syntax.

   4. Implemente sua própria lógica no pacote de interface do usuário para renderizar mensagens de marcação na área de entrada e na transcrição do chat. Se você usa o React, pode usar o react-markdown como referência.

nota

• Os recursos de formatação de texto vão aparecer para o atendente somente se o recurso tiver sido habilitado para o cliente na interface de usuário do chat. Se a formatação de texto não for suportada ou habilitada na interface de usuário do chat do cliente, o atendente não poderá redigir e enviar mensagens com formatação de texto.

• Todos os recursos de formatação de texto, exceto anexos, estão disponíveis para respostas rápidas.

Como adicionar links de e-mail e telefone

O exemplo a seguir mostra como adicionar links clicáveis e chamáveis aos seus aplicativos móveis e da Web.

Call us today: [[phone]](tel:[phone])
[Call Us](tel:[phone])
[Skype Us](callto:[phone])
[Fax Us](fax:[phone])
[Text Us](SMS:[phone])
[Email Us](mailto:[e-mail])

Como adicionar mensagens de chatbot

Ao ativar o markdown para mensagens de bate-papo, você pode usar a formatação rich text para os seguintes tipos de mensagens do chatbot:

• Reproduza fluxos rápidos

• Obtenha fluxos de entrada de clientes

• SYSTEM_MESSAGE

• Lex BOT

• Third Party BOT

• Lex BOT Lambda

A imagem a seguir mostra como ativar um prompt manualmente em um bloco de fluxo de prompts do Play:

A imagem a seguir mostra como ativar uma solicitação manualmente em um bloco de fluxo Get customer input e, em seguida, associar o bloco de fluxo a um bot do Amazon Lex:

A imagem a seguir mostra como o prompt aparece no SYSTEM_MESSAGE e em vários tipos de mensagem do BOT:

A imagem a seguir mostra como configurar um prompt em uma intenção de bot do Amazon Lex:

Para obter mais informações sobre intenções, consulte Adicionar intenções no Guia do desenvolvedor do Amazon Lex V2. Para obter mais informações sobre mensagens do Lambda, consulte Habilitando a lógica personalizada com funções do AWS Lambda, também no Guia do desenvolvedor do Amazon Lex V2.