Documentação

Webflow

Adicione seu agente a um site Webflow usando Custom Code em Project Settings.

Adicione seu agente de IA a qualquer site Webflow colando o código de incorporação em Project Settings → Custom Code. O trecho carrega em todas as páginas automaticamente.

Primeiro, obtenha seu código de incorporação em Chatbot > Publicar no painel.

Configuração Rápida

  1. Abra seu projeto no Designer do Webflow.
  2. Clique no ícone de engrenagem (Project Settings) na barra lateral esquerda.
  3. Vá até a aba Código personalizado.
  4. Role até Código do rodapé (o campo chamado Before </body> tag).
  5. Cole seu código de incorporação.
  6. Clique em Salvar alterações.
  7. Clique em Publicar no canto superior direito para publicar o site.

Exemplo de formato (use os valores reais de Chatbot > Publicar):

<script
  src="YOUR_WIDGET_URL"
  data-chatbot="YOUR_CHATBOT_ID"
  async
></script>

O script do widget foi projetado para carregar depois que a página estiver interativa. Colá-lo em Código do rodapé evita bloquear a renderização inicial e corresponde ao comportamento do atributo async.

Requisitos de Plano

A disponibilidade do Custom Code depende do seu nível de Plano do site. O Webflow historicamente restringiu o custom code em todo o site no plano gratuito Starter, e a disponibilidade tem mudado entre revisões de plano.

Consulte a comparação de planos do Webflow em https://webflow.com/pricing para as regras atuais. Se a aba Custom Code mostrar um ícone de cadeado ou o campo Código do rodapé estiver desabilitado, faça upgrade do Site plan.

Instalação Específica por Página

Para carregar o widget apenas em determinadas páginas:

  1. Abra a página no Designer.
  2. Clique no ícone de engrenagem de Configurações da página nessa página.
  3. Role até Código personalizado → Antes da tag </body>.
  4. Cole seu código de incorporação ali, em vez do campo válido para todo o projeto.

O código no nível da página sobrescreve e complementa o código no nível do projeto para essa página específica.

Depois de Publicar

O custom code só é executado no site publicado, não na pré-visualização do Designer. Depois de salvar, clique em Publicar e escolha seus domínios:

  • *.webflow.io — o domínio de staging
  • Seu domínio personalizado conectado (se houver)

Publique no domínio que você realmente quer testar.

Solução de Problemas

O widget não aparece na pré-visualização do Designer.

  • Esperado. O Custom Code só é executado no site publicado. Abra a URL ativa.

O widget também não aparece no site ativo.

  • Confirme que você clicou em Salvar alterações e Publicar.
  • Confirme que seu domínio está permitido em Chatbot > Publicar > Segurança.
  • Faça um hard-refresh (⌘+Shift+R) para ignorar o cache do CDN.

O campo Custom Code está desabilitado.

  • Seu nível de Site plan não inclui Custom Code. Faça upgrade em https://webflow.com/pricing.

Testando

  1. Abra o site publicado em uma janela anônima.
  2. Procure o balão de chat.
  3. Clique para abrir e envie uma mensagem de teste.

Próximos Passos