Website Chat Widget

Incorpore um chat widget com AI direto no seu site. Os visitantes recebem respostas instantâneas do seu AI agent sem sair do site.

Visão Geral

O Website Widget oferece:

Bolha de chat flutuante no seu site
Respostas de AI em streaming em tempo real
Aparência personalizável (cores, posição, mensagens)
Menos de 11KB em gzip — impacto quase nulo no desempenho
Lista de domínios permitidos para segurança

Pré-requisitos

Um AI agent ativo no seu painel admin
Acesso ao HTML do seu site (para colar uma tag script)

Passos de Configuração

Vá para Integrations na barra lateral
Role até a seção Website Widget
Clique em Create Widget
Insira um nome e selecione o AI agent
Clique em Create

2. Personalizar a Aparência

Clique no card do widget para abrir o painel de edição:

Primary Color — Cor da bolha do chat e do header
Text Color — Cor do texto na bolha e no header
Position — Bottom-right ou bottom-left
Welcome Message — Primeira mensagem que os visitantes veem
Suggested Questions — Até 4 sugestões iniciais clicáveis
Avatar URL — Imagem personalizada no header do chat
Border Radius — Arredondamento das bordas

Uma prévia ao vivo é atualizada conforme você faz mudanças.

3. Definir Domínios Permitidos (Recomendado)

Restrinja quais sites podem incorporar seu widget:

Deixe vazio para permitir todos os domínios (padrão)
Adicione domínios específicos: example.com, *.example.com
Use entradas com porta para desenvolvimento: localhost:3000

4. Incorporar no Seu Site

Clique no ícone de embed no card do seu widget e copie o código:


<script src="https://core-api.cuneiform.chat/api/widget/widget.js"
  data-widget-id="your-widget-id" async></script>

Cole antes da tag </body> no seu site.

Como Funciona


O visitante abre seu site
  → A bolha de chat aparece no canto
  → O visitante clica → O painel de chat abre
  → Welcome message + suggested questions são exibidas
  → O visitante digita uma pergunta
  → O AI agent pesquisa no seu conteúdo
  → A resposta chega em streaming em tempo real

As mensagens são processadas em tempo real. O agent pesquisa no seu conteúdo e gera respostas usando o mesmo pipeline de AI que todos os outros canais.

Recursos

Respostas em Streaming

As respostas chegam em streaming em tempo real via Server-Sent Events (SSE). Os visitantes veem a resposta aparecer progressivamente, parecido com o ChatGPT.

Persistência de Sessão

Visitantes recorrentes no mesmo navegador retomam a conversa anterior dentro de uma janela de 24 horas. As sessões são armazenadas no localStorage do navegador.

Renderização de Markdown

As respostas do agent suportam formatação markdown, incluindo negrito, itálico, listas, blocos de código e links.

Gerenciando Widgets

Na página Integrations, cada card de widget mostra:

Nome e status do widget
Agent atribuído
Ações de editar, código de embed e excluir

Ação	Como
Editar configurações	Clique no card do widget
Pegar o código de embed	Clique no ícone de embed
Excluir	Menu de três pontos → Delete

Segurança

Isolamento por Shadow DOM — O widget fica em sandbox em relação à sua página
HMAC session tokens — Tokens assinados com expiração de 24 horas
Lista de domínios permitidos — Restrinja quais sites podem incorporar seu widget
Rate limiting — 30 mensagens/minuto por sessão
Sem acesso a dados — O widget não consegue ler nem modificar o conteúdo da sua página

Solução de Problemas

Verifique se a tag script está antes de </body>, e não em <head>
Confira se data-widget-id confere com o do seu painel admin
Se a lista de domínios permitidos estiver definida, confirme que seu domínio está nela
Cheque o console do navegador em busca de erros

Garanta que o agent atribuído está com status Active
Verifique se o agent tem documentos no conteúdo
Cheque a aba Network do navegador em busca de requisições de API com falha

Problemas de aparência

O widget usa isolamento por Shadow DOM. O CSS da sua página não vai afetar o widget. Use a prévia ao vivo do painel de edição para personalizar a aparência.

FAQ

Sim. Use o mesmo código de embed em todas as páginas. O widget compartilha o estado da sessão entre páginas do mesmo domínio.

Funciona no celular?

Sim. O widget é totalmente responsivo e otimizado para navegadores mobile.

Posso remover o selo “Powered by”?

O selo é obrigatório nos planos Trial e Starter. Faça upgrade para Plus ou superior para removê-lo.

Funciona com React/Next.js/Vue?

Sim. O widget carrega como um script independente e funciona com qualquer framework, incluindo single-page applications.

Qual é o limite de tamanho da mensagem?

4.000 caracteres por mensagem.