Como adicionar um chat ao seu site no Webflow

O Webflow dá controle total sobre a aparência do seu site, mas um visitante com uma dúvida ainda precisa garimpar suas páginas. Um chat com IA responde a partir do seu próprio conteúdo e, quando necessário, passa a conversa para a sua equipe. Adicioná-lo ao Webflow leva uma linha no código personalizado do site. Este guia mostra onde colá-la e como conferir se o chat está no ar.

Etapa 1: crie o chat e deixe que ele leia seu site

Cadastre-se, crie seu chat e informe o endereço do seu site no Webflow. Escolha quais páginas ler, como páginas de serviços, preços, entrega ou ajuda, e adicione documentos se suas respostas estiverem em arquivos. O chat responde somente a partir do que lê e mostra uma fonte numerada para cada frase. Faça algumas perguntas reais no chat de teste. Se uma resposta estiver faltando ou confusa, melhore a página no Webflow e deixe o chat lê-la de novo. Defina o nome, a saudação e as perguntas iniciais, e escolha um modelo e o seu logotipo. Páginas protegidas por login não podem ser lidas, então mantenha as respostas de que os visitantes precisam em páginas públicas. O chat não informa um preço, uma data ou uma política que suas fontes não informem.

Etapa 2: copie o embed do Webflow em “Add to your website”

Depois de entrar no ar, a OneType mostra sua tag de script pronta para copiar. Ela também está na aba “Add to your website” do seu agente, que oferece “Custom code”, “Webflow” e “Divhunt”. No Webflow, você adiciona o chat como um embed no código personalizado do site, e as etapas abaixo mostram como.

Etapa 3: cole no código personalizado do site

O código personalizado exige um plano de site pago do Webflow. No Webflow:

  1. Abra seu site e vá em “Site settings”.
  2. Clique em “Custom code” no menu da esquerda.
  3. Role até “Footer code” e cole a tag de script.
  4. Clique em “Save changes”.

A mesma linha funciona em todas as páginas do site, então você a cola uma vez só. Se não é você quem edita o site no Webflow, um link na OneType abre um e-mail com o trecho e as instruções, pronto para enviar a quem edita.

Etapa 4: publique seu site no Webflow

Clique em “Publish” no canto superior direito. O chat só aparece no site publicado, não no Designer. Se você testar no endereço de staging do Webflow, que termina em webflow.io, adicione esse endereço exato também aos domínios permitidos do seu agente, porque o chat só carrega nos domínios que você permite. Seu próprio domínio é adicionado para você quando você usa a etapa “Go live”. Quem copiar sua tag de script para outro site não obtém nada.

Etapa 5: confira se está no ar e teste

Abra seu site publicado em uma nova aba. Um botão de chat aparece no canto e, em cerca de um minuto, a OneType mostra “Live on” seguido do endereço do seu site, por exemplo “Live on shop.example.com”, na etapa “Go live”. Você não precisa abrir o chat. Se nada aparecer após dez minutos, confira se a linha está na página publicada, se o endereço é um domínio permitido, se nenhum bloqueador de anúncios ou política de segurança bloqueia o widget e se você recarregou a página. Depois, faça uma pergunta que suas páginas respondem e outra que não respondem. O chat deve dizer que não sabe e oferecer o seu próximo passo.

Coloque um mecanismo de respostas no seu site do Webflow

Veja como funciona a instalação: adicione o chat a qualquer site, ou comece grátis.

Perguntas frequentes

Em “Site settings”, em “Custom code”, na caixa “Footer code”. Você cola uma vez e ele cobre todas as páginas do site. O código personalizado exige um plano de site pago do Webflow.