Skip to main content

​
Live Chat

O Live Chat permite incorporar um widget de chat diretamente no seu site. Visitantes podem iniciar conversas, e você responde pelo painel do Brainchat — com ou sem inteligência artificial.

Widget personalizável

Cores, logo, botões e textos totalmente configuráveis para combinar com sua marca.

Agente de IA integrado

Vincule um agente para responder automaticamente, com fallback para atendimento humano.

​
Criar um Widget

1

Acessar a lista de widgets

Vá em Apps → Live Chat no menu lateral. Você verá todos os widgets criados.
2

Criar novo widget

Clique em Novo Widget. Preencha:
  • Nome — identificação interna (ex: “Chat do Site Principal”)
  • Slug — identificador único na URL (apenas letras minúsculas, números e hífens)
O slug define a URL pública do widget: https://brainchat.app/w/{slug}
3

Configurar e publicar

Após criar, você será redirecionado ao editor visual do widget com todas as abas de configuração.

​
Home Page

A Home Page é a tela inicial que o visitante vê ao abrir o widget, antes de iniciar uma conversa.

​
Título e Subtítulo

Configure a mensagem de boas-vindas com tamanhos ajustáveis (pequeno, médio ou grande).
Use a variável {nome} no título para personalizar com o nome do visitante após a coleta de dados. Exemplo: Olá, {nome}!

​
Avatares da Equipe

Adicione até 4 fotos da equipe que aparecem no topo da home page, transmitindo confiança ao visitante.

​
Botões de Ação

Adicione até 4 botões na home page. Cada botão pode ser de um tipo diferente:
TipoDescrição
LinkRedireciona para uma URL externa
AçãoInicia o chat diretamente
BannerExibe uma imagem de destaque
EmbedIncorpora conteúdo do YouTube ou Spotify
TextoExibe um bloco de texto estático (tamanho e alinhamento configuráveis)

​
CTA Principal

O botão principal abaixo dos botões de ação (ex: “Enviar uma mensagem”) inicia a conversa.

​
Aparência

A aba Aparência controla todo o visual do widget. As cores são organizadas por camada:

​
Cores por Camada

CamadaConfigurações
GeralCor primária, cor secundária, cor da borda
HeaderCor de fundo, cor do texto
BodyCor de fundo, cor do texto
FooterCor de fundo, cor do texto
BalõesCor e texto do balão recebido, cor e texto do balão enviado

​
Imagem de Fundo do Header

Faça upload de uma imagem de fundo para o header. Ajuste a opacidade do overlay (0% a 100%) para garantir legibilidade do texto sobre a imagem. Configure a logo que aparece no header do widget:
  • Upload — envie uma imagem ou cole uma URL
  • Formato — Redonda, Quadrada ou Livre
  • Tamanho — Pequeno, Médio ou Grande

​
Botão Flutuante

O botão que aparece no canto da página do visitante:
ConfiguraçãoOpções
PosiçãoInferior direito ou Inferior esquerdo
EstiloCírculo, Pílula ou Quadrado
TextoTexto opcional exibido ao lado do ícone (apenas nos estilos pílula e quadrado)

​
Estilo dos Campos

Defina o visual dos campos de input do chat:
  • Arredondado — cantos levemente arredondados
  • Pílula — cantos totalmente arredondados
  • Quadrado — sem arredondamento

​
Coleta de Dados (Pré-chat)

Quando habilitada, exibe um formulário antes do início da conversa para capturar informações do visitante.

​
Campos Disponíveis

Adicione campos customizáveis com os seguintes tipos:
TipoMapeamento
NomeSalvo como nome do contato
E-mailSalvo como e-mail do contato
TelefoneSalvo como telefone do contato
TextoCampo de texto livre
Cada campo pode ser marcado como obrigatório e ter um placeholder personalizado.
Os dados coletados no pré-chat são salvos automaticamente no contato criado pela conversa.

​
Mensagens e Perguntas

​
Mensagem de Boas-vindas

A primeira mensagem enviada automaticamente quando o visitante inicia o chat.

​
Mensagem Offline

Exibida quando o atendimento não está disponível.

​
Perguntas Sugeridas

Adicione até 5 perguntas que aparecem como botões clicáveis abaixo da mensagem de boas-vindas. O visitante pode clicar para enviar rapidamente. Exemplos:
  • “Quais são os planos disponíveis?”
  • “Como funciona o suporte?”
  • “Quero falar com um atendente”

​
Agente de IA

Vincule um Agente de IA existente ao widget para responder automaticamente as mensagens dos visitantes.
1

Selecionar agente

Na configuração do widget, escolha um agente da lista de agentes disponíveis na instância.
2

Fallback humano

Ative a opção Fallback Humano para que, quando o agente não conseguir responder, a conversa seja transferida para um atendente.
O agente precisa estar ativo para funcionar no widget. Agentes desativados não responderão.

​
Incorporar no Site

​
Código Embed (Recomendado)

Copie o código de incorporação e cole antes do </body> do seu site: 
<script
  src="https://brainchat.app/widget.js"
  data-widget="seu-slug"
  async>
</script>
O widget aparecerá automaticamente como um botão flutuante no canto da página.

​
URL Direta

Acesse o widget diretamente pelo navegador em: 
https://brainchat.app/w/{slug}
Útil para compartilhar via link ou incorporar em iframes.

​
Abertura Automática

Configure um delay em segundos (0 a 60) para o widget abrir sozinho após o visitante acessar a página. Deixe vazio para abrir apenas por clique.

​
Gerenciamento

Na lista de widgets (Apps → Live Chat), você pode:
AçãoDescrição
Ativar/DesativarWidgets desativados não respondem a visitantes
Copiar códigoCopia o snippet de incorporação para a área de transferência
EditarAbre o editor visual com todas as configurações
ExcluirRemove permanentemente o widget
Cada instância pode ter múltiplos widgets com configurações independentes — útil para sites ou páginas diferentes.