Pular para o conteúdo principal
O Webchat do Invenio Center é uma ferramenta de atendimento digital em tempo real, desenvolvida para facilitar a comunicação entre empresas e seus clientes por meio de websites institucionais, e-commerces ou portais de serviço. A solução permite a troca de mensagens instantâneas, com interface personalizável, integração com outros canais (como WhatsApp), e histórico completo das interações realizadas. Trata-se de uma alternativa eficiente para centralizar atendimentos, agilizar o contato com o cliente e oferecer uma experiência moderna e fluida. Após configurado, o Webchat gera um código pronto para ser adicionado ao site da empresa.

Acesso e Configuração

Para acessar a aba WebChat acesse: Invenio Center > Canais > Webchat Clique aqui para acessar as configurações de canal webchat A interface exibirá seções configuráveis, com funcionalidades que variam conforme a versão utilizada: Versão 2 ou Versão 3.

Versão 2 – Configuração Padrão

Indicada para operações com menor necessidade de personalização.

Aparência

Exibição automática Exibir WebChat automaticamente após o carregamento com tempo de delay. Logotipo no cabeçalho A configuração permite adicionar ou substituir o logotipo do cabeçalho do WebChat, exibindo prévia da imagem, tipo de arquivo (image/png) e tamanho (442.3 KB), para que seja possível visualizar e ajustar o logotipo antes da publicação. Ícone do botão de abertura Permitem personalizar o botão de chamada do WebChat, ou seja, o ícone que o usuário clica para abrir o chat na tela. É possível definir:
  • Ícone do botão, com prévia, tipo e tamanho do arquivo.
  • Delay de exibição, em segundos, controlando o tempo para o botão aparecer após o carregamento da página.
  • Texto do botão de autenticação, exibido na interface inicial do chat.
Observação: Se o texto do botão de autenticação não for definido, o sistema exibirá por padrão a mensagem “Iniciar Atendimento”.
Temas Na personalização do WebChat, é possível selecionar o tema visual desejado para adequar o layout à identidade visual da empresa.
Default: modelo padrão do sistema, com cores neutras e design equilibrado.Dark: aparência escura, ideal para ambientes com pouca luz.Emerald: tons de verde esmeralda, transmitindo elegância e sofisticação.Forest: variação em verde escuro, remetendo à natureza e estabilidade.Gold: tonalidade dourada, trazendo um visual refinado e destaque.Grass: verde claro, com aspecto leve e natural.Light Blue: azul claro, transmitindo leveza e tranquilidade.Orange: tons alaranjados, vibrantes e enérgicos.Ruby: vermelho intenso, associado à força e dinamismo.Sunset: mistura de tons quentes, inspirada no pôr do sol.Violet: roxo suave, com aspecto criativo e moderno.Wine: vinho profundo, ideal para um visual sofisticado e marcante.Yellow: amarelo vibrante, com aspecto alegre e chamativo.Dica: o tema Default é o modelo padrão aplicado automaticamente quando nenhuma outra opção é selecionada.
Botão “Finalizar Atendimento” Exibe a opção para que o cliente encerre o atendimento por conta própria. Redirecionamento para WhatsApp Adiciona um atalho direto para o WhatsApp do número configurado, permitindo definir a posição do botão (à esquerda ou acima) e a mensagem padrão enviada ao abrir a conversa.

Fluxo

Autenticação A configuração de Autenticação permite capturar informações do cliente antes do início do atendimento, habilitando campos como Nome, E-mail, Telefone e CPF/CNPJ. Esses dados ajudam a identificar o usuário e direcionar o atendimento de forma mais assertiva no chat incorporado. Método de segmentação A configuração de método de seleção de segmento define como o contato será direcionado ao iniciar o chat.
  • Método padrão: O usuário escolhe o segmento desejado durante o acesso.
  • Segmento específico: O contato é automaticamente atribuído a um segmento pré-definido, como por exemplo: “Financeiro”.
Feedback NPS Exibe uma tela ao final do atendimento para que o usuário avalie o serviço. Os resultados ficam disponíveis no relatório “WebChat – Net Promoter Score”. Consulte a documentação de “Relatórios” para saber mais Idioma Permite usar o idioma padrão do ambiente ou definir um idioma específico para o chat. Idiomas disponíveis:(Português BR, Inglês, Espanhol e Francês) Sessão do usuário Mantém o atendimento ativo mesmo se o usuário atualizar ou recarregar a página.

Segurança

A configuração de segurança do WebChat oferece dois métodos de autenticação: Autenticação Padrão e Autenticação Automática (CSRF). A autenticação automática CSRF (Cross Site Request Forgery) é opcional, mas recomendada para sites ou portais com área logada. Ela permite validar o acesso do usuário de forma automática, utilizando tokens CSRF enviados via JavaScript. É possível definir o método de autenticação e configurar endpoints para receber o csrf_token, garantindo mais segurança na comunicação entre o site e o WebChat. É possível inserir ou editar a URL da API responsável pela validação do token, garantindo que a autenticação automática seja realizada corretamente. Além disso, pode-se vincular o token a um segmento específico, permitindo que cada área possua seu próprio endpoint de autenticação e regras de verificação personalizadas.

Versão 3 – Funcionalidades Avançadas

Inclui todos os recursos da versão 2, com adições: As configurações apresentadas permitem ajustar sons e avisos do WebChat, aprimorando a interação do usuário:
  • Sons do WebChat: Possibilita reproduzir um som ao receber novas mensagens e definir se será utilizado o som padrão do sistema.
  • Aviso flutuante: Exibe uma mensagem automática após o carregamento do chat, podendo configurar o tempo de exibição (em segundos), o texto exibido e a opção para ocultar o aviso automaticamente.

Código JavaScript de Integração

Após a finalização da configuração, ao optar por Salvar ou Implementar, será gerado um script de integração do WebChat, que deve ser inserido no código do site para ativar o chat.
<script src="https://webchatapi.robbu.global/v3/chat.js"></script>
<script defer="defer">
  chatRobbu.init("111A111111AA1A11", {
    open: true,
    theme: "ruby",
    wallet_customer_code: "Teste",
    delay: 2000,
    user: {
      wallet_customer_code: "Teste",
      name: "Nome do usuário",
      email: "[email protected]",
      phone: "11 9999-99999",
      cpf_cnpj: "000.000.000-00",
      csrf_token: "123"
    }
  })
</script>
Caso seja necessário que o WebChat carregue de forma relativa ao HTML da página, basta adicionar o seguinte código no local onde o chat deve ser exibido:
<div id="chat-robbu-container"></div>
Esse elemento define o ponto exato da página em que o WebChat será renderizado, permitindo maior controle sobre sua posição na interface.
Recomendação: valide a implementação com sua equipe técnica para garantir compatibilidade com o site.


⁉️ Perguntas Frequentes (FAQ)

A Versão 3 oferece recursos adicionais como sons de notificação, aviso flutuante e configurações aprimoradas de aparência, enquanto a Versão 2 é voltada para implementações mais simples e diretas.
Ambas compartilham as mesmas bases de autenticação e personalização de layout.
Sim. É possível definir cores, temas, ícones e logotipos para o cabeçalho e botão de abertura, além de selecionar o tema visual desejado.
O tema Default é aplicado automaticamente quando nenhum outro é selecionado.
O parâmetro delay define o tempo (em milissegundos) para o WebChat ser exibido após o carregamento da página.
Ele pode ser configurado diretamente nas opções de aparência, oferecendo mais controle sobre a experiência do usuário.
Existem dois modos disponíveis:
  • Autenticação Padrão: o usuário informa manualmente nome, e-mail ou telefone antes do atendimento.
  • Autenticação Automática (CSRF): valida o acesso do usuário de forma automática por meio de tokens de segurança integrados a uma API.
Sim. É possível adicionar um botão de redirecionamento para WhatsApp, permitindo que o cliente continue o atendimento no aplicativo, com mensagem e número pré-configurados.
Sim. Ao final do atendimento, é possível habilitar o feedback NPS, que permite ao usuário avaliar o serviço.
Os resultados ficam disponíveis no relatório “WebChat – Net Promoter Score” dentro do Invenio Center.
Após salvar as configurações, o sistema gera um código JavaScript de integração.
Basta copiá-lo e colar no HTML do site, dentro da tag <body>.
Opcionalmente, é possível definir uma div para posicionar o chat em um local específico da página.
O aviso flutuante é uma mensagem automática que aparece na tela inicial do WebChat, podendo conter texto personalizado e tempo de exibição configurável.
Serve para atrair o visitante e incentivar o início da conversa.
O WebChat pode operar em quatro idiomas: Português (BR), Inglês, Espanhol e Francês.
É possível escolher o idioma padrão do ambiente ou definir um idioma específico no chat.
A sessão do usuário é mantida, garantindo que a conversa continue ativa mesmo após o recarregamento da página.
Não. A implementação é simples: basta copiar o código de integração gerado pelo Invenio Center e inseri-lo no site.
No entanto, recomenda-se que um desenvolvedor valide a inserção para garantir compatibilidade com o layout do site.
O CSRF (Cross Site Request Forgery) é um token de segurança usado para validar automaticamente o acesso de usuários logados.
Ele garante que apenas sessões autenticadas possam interagir com o WebChat, evitando acessos indevidos.
Sim. O WebChat pode ser configurado para direcionar automaticamente os atendimentos a um segmento pré-definido, como “Financeiro” ou “Suporte”, otimizando o fluxo de atendimento.
Após inserir o script no site, acesse a página e verifique se o chat é exibido conforme o tempo configurado.
Caso não apareça, confirme se o script está dentro da tag <body> e se o ID do WebChat corresponde ao fornecido no Invenio Center.