O Webchat é um sistema que utiliza interfaces web de fácil acesso. Ao conectar esse canal com a Botmaker no seu site para automatizar respostas ou oferecer atendimento com atendentes de live chat, você vai poder se comunicar com usuários em tempo real, proporcionando uma melhor experiência de atendimento.

Leitura estimada: 06 minutos

Como integrar o canal?

Para integrar o Webchat, entre na plataforma e vá para Configuração > Canais (https://go.botmaker.com/#/integrations/channels).

Selecione Webchat e clique em Conectar.

Nessa seção de Canais, você vai poder criar e administrar webchats e integrá-los no seu site.

Como personalizar o canal com estilos e cores e integrá-lo no seu site?

A interface do canal de webchat oferece uma versão simplificada para a integração no site através do código script que você deve incluir no tag body da sua página na web.

O painel de controle do webchat apresenta três telas importantes:

• Instalação: para integrar o canal com seu site através do código script.
• Geral: permite selecionar a posição do webchat dentro do seu site, assim como o estilo da fonte.
• Personalização: na janela do webchat à esquerda, você pode fazer a personalização com cores e estilos variados.

Na tela Instalação, você vai poder acessar o código script para integrar o webchat no seu site.

Nota: a barra deslizável azul permite habilitar ou desabilitar o webchat. Lembre-se de ativá-la toda vez que desejar que o webchat esteja disponível no seu site.

• A tela Geral permite identificar a posição do webchat, as formas de visualização e a fonte do texto que vai ser usada nas conversas com usuários.

• A tela de Personalização permite trocar as cores e os estilos do seu webchat.

Além disso, ao clicar em + Novo, você pode acessar vários temas com estilos e cores. Clicando em Criar webchat, um novo webchat será criado com o tema selecionado, e pode ser personalizado de acordo com as suas preferências.

Como personalizar as mensagens do webchat?

Você pode configurar um menu persistente que vai ficar sempre visível no webchat. Essa opção permite que o usuário acesse facilmente as funcionalidades do seu chatbot. Para isso, insira opções que levem o usuário a fluxos importantes do seu chatbot clicando no botão Configurar as mensagens padrão, que fica no canto superior direito da tela.

Nesse caso, configuramos três opções para o menu persistente, como você pode conferir a seguir:

Considerações adicionais

Clicando em Descartar alterações, é possível desfazer as configurações ou mudanças do estilo do seu webchat. Por outro lado, para que as alterações de estilo, fontes ou mensagens fiquem visíveis para os usuários, você deve clicar em Publicar alterações.

Por fim, na seção Chatbots, você vai poder selecionar o chatbot da sua preferência e testar seu webchat em tempo real para conferir se ele atende às suas necessidades.

Utilizar variáveis no Webchat

Além disso, também é possível editar variáveis existentes no início de uma conversa de WebChat.

Configurar variáveis

Dentro do snippet de código usado para integrar o WebChat em seu site, você pode setar variáveis com informações externas.

Deve ser agregado um novo objeto que contenha as variáveis com os valores a serem editados. O objeto é o BOTMAKER_VAR.

<script>
<!-- Todas as variáveis devem ser definidas aqui -->
    var BOTMAKER_VAR = {
        firstName: 'newValueForFirstName', 
        lastName: 'newValueForLastName', 
        customVar: 'newValueForCustomVar'
        };
        
    (function () {
        let js = document.createElement('script');
        js.type = 'text/javascript';
        js.async = 1;
        js.src = 'https://go.botmaker.com/rest/webchat/p/XXXXX/init.js';
        document.body.appendChild(js);
    })();
</script>

Você pode editar suas variáveis, como firstName e lastName, ou novas variáveis. A única condição é que elas já existam no bot.

Como você mantém o ID do sistema?

Se você quiser manter ou usar um ID de sistema exclusivo associado ao chat, poderá enviar esses dados na variável userIdOnBusiness dentro do BOTMAKER_VAR.

<script>
<!-- All variables must be defined here-->
    var BOTMAKER_VAR = {
        userIdOnBusiness : 'myBusinessId', 
        ...
        };

(function () {
        let js = document.createElement('script');
        js.type = 'text/javascript';
        js.async = 1;
        js.src = 'https://go.botmaker.com/rest/webchat/p/XXXXX/init.js';
        document.body.appendChild(js);
    })();
</script>

INTEGRAÇÃO DE APLICATIVOS MÓVEIS

Para integrar o webchat ao seu celular, você pode optar por:

• Incorporar o webchat em uma visualização da Web. O mesmo script da Web é usado. Para uma melhor experiência móvel, é recomendável usar os métodos expostos do webchat. Exemplo:

Integre-o ao próprio chat do seu aplicativo móvel, incorporando e processando as mensagens enviadas e recebidas por meio da API do Botmaker. Nesse caso, o serviço /intent/processMessage é usado (para processar a pergunta do usuário e receber a resposta do bot) e, para suporte manual por agentes, o serviço /message/v3 é usado para enviar as mensagens do agente.

O canal de webchat é uma ferramenta flexível e útil para seus usuários, já que não requer a instalação de nenhum software em específico e permite que a conversa ocorra diretamente através do seu site. Dessa forma, você vai ter um serviço de atendimento que atende às expectativas do seu público em um canal digital que aproxima pessoas que já tiveram contato com seu negócio anteriormente ou que acabaram de conhecê-lo.

Lembre-se de visitar nossa Central de Ajuda para mais informações.

Escrito por: Equipe Botmaker

Atualizado: 27/11/2023