Como adicionar um chatbot de IA ao seu site sem programar

Você pode adicionar um chatbot de IA ao seu site fornecendo ao Agente o conhecimento da sua empresa, configurando suas respostas e instalando um widget de chat com um plugin ou com o script fornecido. O chatbot para sites do Quickchat AI reúne o conhecimento, as configurações de conversa e a Inbox da equipe em um só lugar. Os visitantes fazem perguntas no seu site sem precisar criar uma conta.

Este tutorial cria o exemplo da Kestrel Kitchens, uma empresa fictícia de projetos de cozinha. Um visitante pergunta quanto tempo leva uma reforma, consulta o custo provável de uma cozinha de 3 por 4 metros e solicita um orçamento. O Agente responde com base nas informações da empresa, coleta os detalhes do projeto e permite que um projetista continue a conversa.

A configuração principal não exige programação. Siga as etapas de conhecimento e instruções, captação de leads e transferência para atendimento humano, depois instale o widget. Uma API Action opcional envia as solicitações completas a outro sistema.

Baixe o kit de configuração da Kestrel Kitchens para obter o site de exemplo, o conhecimento, o Main Prompt, as configurações e as mensagens de teste. São arquivos editáveis para acompanhar as etapas no painel, não uma importação do Agente com um clique.

As capturas de tela e os artefatos copiáveis do kit, dos prompts e das configurações permanecem em inglês para permitir a reprodução do exemplo testado.

O que o chatbot do site vai fazer?

O chatbot responde a perguntas com base no seu conteúdo, salva os dados de quem solicita um contato posterior e transfere conversas para sua equipe quando uma pessoa precisa intervir.

Cada resultado exige uma evidência diferente. Uma faixa de preço correta vem da Knowledge Base. Uma solicitação de orçamento precisa dos dados de contato e do projeto na Inbox. Uma transferência exige que uma pessoa assuma a conversa e envie uma resposta que chegue ao visitante.

O percurso do visitante pelo exemplo. Uma solicitação de orçamento registra o interesse; o projetista ainda precisa confirmar o preço e a disponibilidade.

O que você precisa antes de adicionar um chatbot?

Você precisa de uma conta no Quickchat AI, informações verificáveis sobre a empresa e acesso às configurações de plugins ou código personalizado do site.

1. Crie uma conta no Quickchat AI e conclua o cadastro. Use um Agente separado para este exercício, para que os dados de exemplo não afetem um atendimento ao cliente existente.
2. Prepare suas páginas de serviços, perguntas frequentes e políticas ou use o conhecimento fictício do kit. Substitua os preços e a área de atendimento fictícios antes de implantar o chatbot em uma empresa real.
3. Confira se o plano do seu site permite o método de instalação escolhido. O WordPress exige acesso a plugins; alguns construtores hospedados exigem um plano pago para código personalizado em todo o site.
4. Combine com alguém para acompanhar a Inbox de teste quando você experimentar a transferência para atendimento humano. Tenha um navegador em um computador e um celular disponíveis para as verificações finais no site.

Free é destinado ao aprendizado pessoal e não comercial. O plano Free inclui 50 créditos de IA por mês. Uma implantação empresarial exige um plano comercial, e os testes consomem a mesma franquia de respostas das demais conversas com IA. Assinaturas de construtores de sites e custos de APIs externas são separados. A seção de custos diferencia esses valores.

Etapa 1: Como treinar um chatbot com o conteúdo do seu site?

Adicione à Knowledge Base as páginas que contêm as respostas da sua empresa e verifique o conteúdo importado antes de testar. Isso fornece ao Agente material de referência para suas respostas.

Crie o Agente de aprendizado

1. Na primeira tela de configuração, selecione Set up manually. Em um painel existente, use o + ao lado de AI Agent (Add new AI Agent) para iniciar um Agente separado e selecione Set up manually.
2. Em Identity, insira Kestrel Kitchens em Name your AI Agent. Cole o arquivo main-prompt.txt do kit em Describe what you want your agent to do. Esse texto se torna o Main Prompt do Agente, explicado na Etapa 2. Selecione Next.
3. Deixe Knowledge Base vazia por enquanto e selecione Next. Avance por External apps sem selecionar uma conexão. Em Deployment, selecione Chat widget e depois Next.
4. Em Choose your plan, use Skip for now para continuar o exercício de aprendizado pessoal ou selecione um plano comercial adequado para uso empresarial. Conclua ou dispense qualquer oferta opcional exibida depois.
5. No painel, confirme o nome do Agente em Identity e abra Knowledge Base. Escolha suas próprias páginas ou o artigo de exemplo fornecido abaixo.

Importe suas próprias páginas

1. Em Knowledge Base, selecione Add Website. Escolha uma página ou a opção de importação do site, conforme a quantidade de conteúdo necessária.
2. Insira a URL pública. Para importar um site, revise as páginas encontradas e selecione as páginas de serviços, preços, processos e perguntas frequentes que devem orientar as respostas.
3. Inspecione o texto importado. Confirme se os preços incluem a moeda e o tratamento tributário corretos e se promoções antigas ou páginas sem relação com o assunto não viraram fontes.
4. Aguarde a conclusão do processamento. Aplique ou publique qualquer alteração de conhecimento pendente indicada no painel antes de testar o widget instalado.

Comece com algumas páginas claras. Um site pode destacar preços em um cartão atraente e colocar as condições em outro lugar; o Agente precisa de ambos. Importar apenas a página inicial pode deixar de fora as condições de instalação, os limites geográficos ou a política de reembolso que tornam uma resposta útil.

Use a fonte da Kestrel Kitchens

Para reproduzir o exemplo sem precisar hospedar um site antes, adicione os dados diretamente:

1. Em Knowledge Base, selecione Add Article. Isso cria um artigo Untitled e abre Edit Article.
2. Insira Kestrel Kitchens: services, prices and process em Title. Em Content, escolha Plain Text e cole o arquivo knowledge.txt do kit.
3. Selecione Save e aguarde até que o artigo esteja Ready. Confirme se o título aparece na lista da Knowledge Base.

O artigo salvo preserva as condições de preços e prazos. Seus dados fictícios correspondem ao site de exemplo.

Kestrel Kitchens is a fictional kitchen design and renovation business used in this tutorial. It serves Bristol, Bath and addresses within 25 miles of central Bristol.

Services: kitchen design, supply and full installation. A full kitchen renovation typically costs £18,000 to £45,000 including VAT. This is a planning range, not a quote. The final price depends on the survey, layout, cabinetry, appliances and building work. Room dimensions alone are not enough to calculate a firm price.

Timelines: survey and design normally take 2 to 3 weeks. Installation usually takes 4 to 8 weeks after all materials are available. These are typical durations, not a promised start date or completion date.

Process: discuss the project, arrange a site survey, agree the design and receive a written quote, then schedule work once the quote is accepted and materials are available. The chatbot cannot book a survey or confirm availability.

The design team works Monday to Friday, 09:00 to 17:00, Europe/London. Quote enquiries need the visitor's full name, email, postcode and project type. A preferred timeline is helpful but optional. The team follows up by email. Do not promise a response deadline.

A fonte deixa o financiamento intencionalmente sem especificação. Isso permite testar como o Agente lida com uma lacuna real. Em um site real, mantenha as páginas de origem atualizadas e use as configurações de atualização compatíveis quando disponíveis; o guia de Knowledge Base explica como organizar e testar essas fontes.

Etapa 2: O que o chatbot deve dizer e nunca prometer?

Use Main Prompt para definir como o Agente aplica o conhecimento: responder primeiro, manter a resposta útil e deixar decisões como um orçamento fechado para a equipe.

No exemplo da Kestrel, as dimensões do cômodo estabelecem a escala do projeto. Elas não determinam os armários, os eletrodomésticos ou as obras necessárias. O Agente deve explicar a faixa de planejamento da fonte, de £18,000 a £45,000, incluindo VAT, sem calcular um preço mais preciso a partir da área do piso.

Estes preços são dados fictícios do tutorial. O objetivo é preservar a diferença entre os fatos da fonte e uma decisão que sua equipe ainda precisa tomar.

1. Em Identity, selecione Edit no cartão Main Prompt.
2. Cole o prompt completo abaixo. Aguarde o salvamento e reabra o editor para confirmar o texto armazenado.
3. Mantenha os dados da empresa na Knowledge Base. Use o prompt para o estilo das respostas, o comportamento de coleta e as decisões que exigem uma pessoa.

Main Prompt é o campo de instruções. O texto completo abaixo e no kit é a versão para copiar.

You are the website assistant for Kestrel Kitchens. Help visitors understand our services, indicative prices and process using the Knowledge Base.

Answer the visitor's question before asking for contact details. Keep replies concise, usually two to four sentences. Use the visitor's language.

Treat prices as planning ranges. Never calculate a firm quote from room dimensions, invent a discount, promise a start date, confirm a survey booking or claim financing is available. If the Knowledge Base does not answer a question, say that a designer must confirm it.

When a visitor wants a quote or follow-up, collect their full name, email, postcode and project type in conversation. Ask one or two relevant questions at a time. Ask about their preferred timeline only after the required details, and accept a refusal without pressure. Do not ask for payment information.

Offer Human Handoff when the visitor asks for a designer or needs information you cannot confirm. Respect the configured working hours. Never claim that a designer is connected or a quote is booked. If the team is unavailable, offer an email follow-up.

Acknowledge the details the visitor has provided. Do not claim CRM delivery or a confirmed booking. The design team reviews enquiries in the Inbox.

Abra AI Preview e pergunte How long does a full kitchen renovation take?. No teste de controle local, o Agente respondeu com 2 a 3 semanas para vistoria e projeto, seguidas de 4 a 8 semanas para instalação depois que os materiais estiverem disponíveis. Tanto o prazo quanto a condição são relevantes.

Inicie uma nova conversa e pergunte Do you offer financing?. A resposta correta reconhece que a fonte não estabelece uma oferta e encaminha a pergunta a um projetista. Acrescentar uma formulação mais confiante ao prompt não forneceria o dado ausente sobre a empresa.

Etapa 3: Como coletar solicitações de orçamento no chat?

Smart Data Gathering solicita informações selecionadas durante uma conversa e salva o que o visitante fornece. Para uma solicitação de orçamento, colete apenas o que o projetista precisa para dar continuidade ao atendimento.

1. Abra Actions & MCPs, ative Smart Data Gathering e selecione Edit Action. Defina Name como Quote enquiries e Description como Capture contact and project details for a kitchen design enquiry. O nome salvo se torna o título do cartão.
2. Em Data to collect, adicione as linhas abaixo. Mantenha estes nomes de Data point em inglês ao reproduzir o exemplo; os nomes dos dados de contato têm mapeamentos especiais para os campos de visitante da Inbox.
3. Defina Reason for collecting information como So a Kestrel Kitchens designer can assess your project and follow up by email.
4. Defina When to ask for data como After exchanging a few messages e How to ask for data como Subtle.
5. Salve a Action. Em AI Preview, faça uma pergunta útil sobre os serviços antes de solicitar um orçamento e inspecione os dados salvos em Inbox.

As perguntas descrevem as informações a coletar. As configurações de momento e estilo orientam quando perguntar; teste também a conversa real.

Nome, e-mail, código postal e tipo de projeto são os dados obrigatórios para uma solicitação completa neste exemplo. O prazo desejado é opcional, como explica o Main Prompt. Esse requisito da empresa é separado das configurações de coleta na conversa; a Etapa 8 exige os campos obrigatórios antes do envio de uma solicitação ao CRM.

O Agente deve responder a uma pergunta geral sobre custos sem exigir um endereço de e-mail como condição para fornecer a resposta. Um visitante também pode recusar a coleta. Use I am only researching. I do not want to leave contact details. para verificar se a conversa continua útil sem solicitações repetidas.

Para onde vão os dados coletados?

Abra a conversa em Inbox. Os dados de contato padrão aparecem nos campos do visitante; os outros valores coletados permanecem associados à conversa e podem ser exportados por Export Gathered Data.

Em Where to send data, Email new leads notifica todos os administradores do Agente quando um endereço de e-mail ou número de telefone é coletado pela primeira vez. Um nome sozinho não dispara o e-mail. Preview e Simulation não enviam essas notificações, então verifique sua própria caixa de entrada de administrador com um teste controlado no widget instalado antes de depender da entrega por e-mail. O passo a passo local mantém a entrega externa de e-mails desativada.

A documentação de Smart Data Gathering descreve coleta, notificações e exportações. No seu site, explique por que você solicita as informações e inclua no widget um link para seu aviso de privacidade. O guia de proteção de dados em chatbots ajuda a revisar o fluxo de dados mais amplo.

Etapa 4: Como permitir que uma pessoa assuma o chat?

Human Handoff transfere uma conversa para sua equipe; uma pessoa então assume em Inbox e responde ao mesmo visitante.

Prepare a transferência antes de publicar o widget. Quem pede para falar com um projetista não deve precisar terminar o formulário de orçamento primeiro, e o Agente não deve dar a entender que alguém está online fora do horário de atendimento.

1. Em Actions & MCPs, ative Human Handoff e abra Edit Action.
2. Mantenha ativadas as regras padrão Media Message, User Frustration, Customer Support Suggestion e Lack Of Knowledge; deixe Irrelevant Advice desativada. O Main Prompt já explica quando oferecer contato com um projetista. O exemplo testado usa essas regras padrão sem adicionar regras personalizadas.
3. Configure as mensagens e a disponibilidade abaixo e salve. Mantenha Email notifications desativada no exercício de aprendizado e verifique a transferência diretamente na Inbox.

Use horários em que uma pessoa realmente acompanha a Inbox. O horário fictício não é uma promessa de resposta imediata.

Durante um período com atendimento, pergunte Can I speak to a designer? pelo site. Conclua qualquer confirmação de transferência solicitada pelo Agente. Na Inbox, abra a conversa e selecione Assign to me quando ela estiver sem responsável ou Take over quando esse controle aparecer. Envie uma resposta humana e confirme se o visitante a recebe. Use Reassign to AI quando a IA deve retomar o atendimento.

Verifique quem assumiu a conversa e a entrega da resposta humana, além da oferta de transferência feita pelo Agente.

Repita em uma nova conversa fora do horário configurado. O Agente deve explicar a disponibilidade e oferecer a forma de contato posterior definida. Se você alterar temporariamente o horário para executar essa verificação, restaure o horário real depois. A documentação de Human Handoff explica as configurações e o fluxo na Inbox.

O passo a passo de transferência de conversas do chatbot para uma pessoa inclui verificações separadas da responsabilidade pela conversa, do retorno à IA e de falhas fora do horário de atendimento.

Etapa 5: Como adaptar o widget ao seu site?

Defina a aparência e o texto fixo em Channels → Your Website. Mantenha a mensagem de boas-vindas específica o suficiente para explicar o que o visitante pode perguntar.

Aparência

1. Abra Appearance. Para a Kestrel, escolha um tema Custom com fundo branco, cabeçalho e cor de destaque em verde-escuro (#315448) e texto do cabeçalho branco. Mantenha o tamanho de texto padrão e os controles arredondados.
2. Em Branding → AI Agent Avatar, clique no ícone de envio do avatar, escolha website/kestrel-avatar.png no kit e selecione Upload na caixa de diálogo de recorte.
3. Defina Widget window max width como 400px e Widget window max height como 520px. Escolha Small para o tamanho do botão de abertura, posicione-o à direita e use Ask about your kitchen como rótulo. O rótulo está disponível com o botão pequeno. Confira a posição na prévia em relação a banners de cookies ou outros controles flutuantes do site.
4. Deixe Auto-open Widget desativado. Abrir o widget a cada carregamento de página interrompe a navegação, principalmente no celular.

Confira a prévia ao escolher as cores. O teste no site publicado continua necessário porque o botão de abertura divide espaço com os controles do seu site.

Conteúdo de texto

Abra Text Content e use estes valores:

As sugestões de início de conversa devem abrir tarefas úteis. O aviso informa aos visitantes quais decisões ainda precisam de um projetista.

O Agente pode responder no idioma do visitante. Traduzir a mensagem fixa de boas-vindas e os rótulos do widget é uma configuração separada em Other languages, disponível nos planos pagos. Em um site multilíngue, teste tanto a resposta quanto o texto fixo da interface; o guia de chatbots multilíngues explica essa distinção.

Alterações de aparência podem levar alguns minutos para chegar às sessões de visitantes em cache. Recarregue antes de concluir que uma alteração salva falhou. Hide Quickchat AI Branding exige o plano Professional ou superior; o passo a passo de marca branca aborda as outras áreas que você deve inspecionar.

Etapa 6: Como instalar o chatbot no seu site?

Instale o Widget no layout compartilhado do site ou use a integração compatível com a plataforma. O Widget flutuante precisa ser executado na página em que o visitante está navegando.

1. Abra Channels → Your Website → Install.
2. Ative Widget & Embed access para o widget público.
3. Escolha o método de instalação para seu site e copie o trecho de código ou Scenario ID exibido para este Agente.
4. Publique a alteração, abra o site público e faça uma pergunta cuja resposta você sabe que está na Knowledge Base.

Copie da tela Install deste Agente. Seu Scenario ID é um identificador público do widget, não uma chave de API privada.

Qualquer site: cole o trecho de código do Widget antes da tag de fechamento do body

Escolha Install manually with code e copie o trecho de código do Widget. O carregador atual tem este formato:

<script>
  (function(e,a,d,i,c,t=a.createElement(d)){e[c]=e[c]||function(){(e[c].q=e[c].q||[]).push(arguments)},t.src=i,t.async=1,a.body.insertAdjacentElement("beforeend",t)})(window,document,"script","https://bubble.quickchat.ai/chat.js","_quickchat");
  _quickchat("init", "YOUR_SCENARIO_ID");
</script>

Substitua YOUR_SCENARIO_ID pelo valor de Install. Cole o trecho completo uma única vez, imediatamente antes de </body> no layout compartilhado ou use o campo de rodapé global do construtor. Esse carregador insere um script no corpo da página, então colocá-lo no head antes de o body existir pode impedir seu carregamento.

A localização importa. Um bloco HTML baseado em iframe é uma página separada e não é adequado para este Widget flutuante.

A opção separada Embed coloca um chat dentro de um contêiner da página. Use o trecho de código gerado por ela se quiser uma seção de chat incorporada. Um bloco HTML que insere código diretamente na página pode atender a esse formato; um bloco do construtor que isola código em um iframe é um caso diferente. Consulte a documentação do canal Website.

WordPress: instale o plugin oficial

1. No WordPress, abra Plugins → Add New, pesquise Quickchat AI Agent e escolha Install Now e Activate.
2. Abra Settings → Quickchat AI Agent.
3. Cole o Scenario ID da tela Install do Quickchat AI e selecione Save Changes.
4. Abra uma página pública e verifique o widget. Use o plugin ou um trecho de código manual para não instalar o carregador duas vezes.

Você precisa de uma instalação e de um plano do WordPress que permitam plugins. O guia de chatbot para WordPress mostra a interface do plugin e as verificações específicas do WordPress.

Squarespace: use a injeção de código no rodapé (Footer Code Injection)

1. Abra o painel Code Injection do site. Use a busca de configurações do painel se a navegação for diferente na sua conta.
2. Cole o trecho completo do Widget em Footer e salve.
3. Abra a página publicada em outra aba do navegador e teste uma resposta.

O Squarespace oferece Code Injection nos planos Core, Plus, Advanced e em alguns planos antigos. A injeção no rodapé coloca o código antes de </body> em todo o site. Use esse recurso para o widget flutuante; um bloco de iframe em uma página não é equivalente. Esse código personalizado não se estende às páginas de checkout do Squarespace.

Wix: use código personalizado no fim do body (Body - end)

1. No painel do site, abra Settings → Custom Code e depois + Add Custom Code.
2. Cole o trecho de código do Widget e dê a ele o nome Quickchat AI widget.
3. Aplique a All pages, escolha Body - end e depois Apply.
4. Teste o site publicado, incluindo a navegação para outra página.

O Wix exige um site publicado com um domínio conectado para usar código personalizado. Use a configuração global Custom Code para este widget flutuante.

Webflow: use código no rodapé e publique

1. Abra Site settings → Custom code.
2. Cole o trecho de código do Widget em Footer code e escolha Save changes.
3. Use Publish para publicar no domínio desejado e teste essa URL publicada.

As configurações de código personalizado do Webflow exigem um Workspace pago elegível ou um plano Site ativo. Apenas salvar a configuração não a publica.

Shopify: escolha o trecho de código do Agente existente ou o aplicativo da Shopify

Para o Agente da Kestrel que você já criou, adicione o trecho de código do Widget imediatamente antes de </body> em Online Store → Themes → Edit code → layout/theme.liquid, salve e inspecione a loja. Faça um backup do tema antes de editar e verifique novamente a instalação após trocar de tema. Esse caminho exibe o Agente selecionado; não configura Actions de produtos ou pedidos.

Para um Agente voltado à loja, a configuração do aplicativo Quickchat AI para Shopify conecta a loja por seu próprio fluxo inicial. Depois dessa conexão, use Enable Widget in Shopify Theme Editor ou abra Online Store → Themes → Edit theme → App embeds. Ative Quickchat AI Widget e salve. A documentação de app embeds da Shopify explica os controles do tema; reative o app embed ao trocar o tema publicado.

Os caminhos dos construtores acima foram conferidos na documentação oficial. As capturas de tela do passo a passo mostram o site de exemplo da Kestrel e o widget local real; não são capturas de contas autenticadas em cada construtor.

Verifique o trecho de código antes de investigar problemas do Agente

Estas verificações opcionais usam os valores que você fornece:

• Verifique um trecho de código do Widget. Compare o código colado com o Scenario ID fornecido. Essa verificação não acessa seu site.
• Compare métodos de implantação. Confira seus canais declarados, acesso ao site e recursos necessários em relação às opções de configuração do Quickchat AI. Essa verificação não inspeciona seu site nem sua conta.

Em um navegador compatível, essas verificações também estão disponíveis como ferramentas do site. Os links abrem os formulários padrão.

Etapa 7: Como testar o chatbot antes dos visitantes?

Teste separadamente a resposta, os dados armazenados e a entrega da mensagem. AI Preview e Simulation Testing ajudam a avaliar o comportamento; o site publicado comprova que o visitante consegue usar o widget instalado.

Execute perguntas independentes em Simulation Testing

Abra Testing → Create Dataset, dê o nome Kestrel Kitchens: website launch checks e escolha Paste messages. Adicione as perguntas sobre prazo, preço e financiamento abaixo, separadas por uma linha contendo --- entre as perguntas. Uma simples quebra de linha mantém o texto em uma única mensagem de teste. Defina Evaluation criteria para verificar os fatos e a concisão das respostas e selecione Run → Start Run. O kit inclui as mensagens e os critérios exatos.

Cada linha do dataset inicia uma conversa separada. Use Simulation para essas perguntas independentes; execute as verificações de orçamento com várias trocas de mensagens e de intervenção humana em uma única conversa de AI Preview ou do site. Inspecione o log da Action e o receptor separadamente, pois um avaliador da transcrição não consegue verificar a entrega externa.

Abra uma execução concluída e inspecione suas respostas. Esta resposta de preço preserva a faixa de planejamento; a pontuação da resposta não comprova a entrega a outro sistema.

Use uma nova conversa entre casos independentes. Recarregar a página pode retomar uma conversa existente, então use o controle de nova conversa do widget quando precisar de um teste do zero.

Verifique o site em um celular

Em telas com menos de 768 pixels CSS, o widget aberto usa um layout de tela inteira. Verifique se você consegue abri-lo, digitar com o teclado visível, rolar a conversa e fechá-lo para voltar ao site.

Finalize com uma pessoa real respondendo pela Inbox. Uma boa resposta de IA não comprova que o caminho de atendimento humano funciona. Repita um pequeno conjunto dessas verificações depois de alterar fontes, prompts, Actions ou o tema do site.

Etapa 8: Como enviar uma solicitação completa ao seu CRM?

Uma API Action opcional pode enviar os campos salvos a um receptor HTTP depois que a conversa tiver todas as informações obrigatórias. O chatbot principal do site já pode ser usado sem essa extensão.

A distinção relevante é entre um contato foi coletado e esta solicitação está completa. O Quickchat AI define lead_captured quando coleta um novo campo de contato padrão, incluindo um nome. Esse indicador sozinho não comprova que há e-mail, código postal ou tipo de projeto.

A plataforma verifica todas as condições. O modelo coleta as informações; as condições determinam quando a requisição pode ser executada.

Prepare o receptor

Use um endpoint de CRM ou automação sob seu controle que aceite o corpo JSON abaixo. O kit inclui um pequeno receptor de demonstração local para quem quiser inspecionar a requisição antes de conectar um CRM. Suas instruções de configuração criam um token privado e explicam como expor um endpoint HTTPS temporário. Envie apenas dados fictícios de teste ao receptor de demonstração.

Para uma integração gerenciada, siga o tutorial de relatórios no Google Sheets ou o passo a passo de CRM personalizado. Não ative dois fluxos que criem o mesmo lead.

Configure uma API Action automática

1. Abra Actions & MCPs → Custom Actions → Add Action → API Action. Escolha Create manually se o construtor baseado em descrição abrir.
2. Defina API Action Name como Send quote enquiry.
3. Deixe What to ask the user first vazio. Esta Action lê os campos já salvos por Smart Data Gathering; ela não pede ao modelo que preencha um segundo conjunto de parâmetros.
4. Em API Endpoint, selecione POST e insira a URL HTTPS /enquiries do seu receptor.
5. Adicione os cabeçalhos, o corpo e as condições abaixo, salve e ative a Action.

Insira o token apenas na configuração de cabeçalho da Action. Mantenha-o fora do prompt, do trecho de código do site e da conversa com o visitante. O README do receptor de demonstração explica como gerá-lo; use a autenticação documentada do seu CRM em uma integração real.

Na aba Body, selecione JSON e insira:

{
  "conversation_id": "{{conversation_id}}",
  "name": "{{metadata_visitor_name}}",
  "email": "{{metadata_visitor_email}}",
  "postcode": "{{metadata_postcode}}",
  "project_type": "{{metadata_project_type}}"
}

Use Add AI Data para inserir os valores integrados e de metadados correspondentes. conversation_id identifica a conversa. Os outros valores vêm dos campos salvos; os nomes de contato em inglês são mapeados para visitor_name e visitor_email, enquanto Project type se torna project_type. A documentação de variáveis explica esses mapeamentos.

Em When to run, escolha When metadata matches. Em Run when, adicione todas as cinco linhas; as condições de metadados são combinadas com AND:

Para esses campos de texto, is true rejeita valores vazios e também textos equivalentes a falso. exists verifica apenas se uma chave está presente; uma string vazia salva pode passar nessa verificação. Os testes abaixo mostram por que a condição mais rigorosa importa. Isso verifica se foi fornecido texto utilizável, mas não confirma de forma independente a identidade do visitante ou os dados do imóvel.

Use esta API Action Description:

Send a quote enquiry to the design team when the visitor has provided their full name, email, postcode and project type. This records an enquiry only; it does not book a survey or confirm a price.

As duas primeiras das cinco condições salvas. Adicione todas as linhas da tabela; When metadata matches verifica essas condições após uma interação da IA, sem que o Agente escolha a Action.

A Action é tentada uma vez por conversa quando todas as condições são atendidas. Ela não é executada novamente quando o visitante informa o período desejado para começar, que é opcional, e uma requisição enviada que falha não é repetida automaticamente nessa conversa. Mantenha esse dado na Inbox para o projetista ou crie uma integração explícita de criação e atualização se seu CRM precisar de alterações posteriores.

A requisição é executada após a interação da IA, e sua resposta não é inserida no chat. Por isso o Main Prompt reconhece os dados do visitante sem afirmar que um CRM os aceitou. Verifique a entrega no log da Action e no receptor. A documentação de Actions automáticas descreve esse comportamento de execução.

Teste dados parciais e depois a solicitação completa

A primeira versão usava exists para os campos de texto obrigatórios. Sam forneceu um nome e depois um e-mail na mensagem seguinte. Smart Data Gathering já havia criado valores vazios para código postal e tipo de projeto, então essas chaves existiam e a Action enviou uma requisição incompleta. Isso também consumiu sua única tentativa naquela conversa.

A correção foi alterar as quatro condições de campos de texto para is true, mantendo o restante da configuração. Repita o teste em uma conversa nova, fornecendo apenas um e-mail na segunda interação. A Action deve aguardar os demais dados do projeto.

Esta é uma conversa observada, não uma taxa de sucesso em produção. Reproduza o teste com uma nova conversa, inspecione os campos salvos após cada interação e verifique a requisição no seu próprio endpoint.

A chamada real da Action retornou HTTP 201. Abra os detalhes para inspecionar a requisição; o registro salvo abaixo mostra o que o receptor armazenou.

Um registro real salvo pelo receptor de demonstração autenticado. Trata-se de uma solicitação, não de um orçamento ou agendamento confirmado.

A demonstração usou um receptor local e registrou uma entrega HTTP real. Um Agente hospedado no Quickchat AI precisa de um endpoint HTTPS acessível publicamente; uma URL localhost no seu computador não é acessível pelo serviço.

Se nada chegar, inspecione View logs na Action e os metadados salvos da conversa. Valores ausentes, uma Action desativada e uma falha HTTP exigem correções diferentes. Corrija a configuração e use uma conversa nova para testar novamente o gatilho automático; pedir para repetir no mesmo chat não reinicia uma tentativa limitada a uma vez por conversa.

Por que o chatbot não aparece ou mostra configurações antigas?

Verifique a página publicada, o local da instalação e o acesso do Agente antes de alterar o prompt. Um problema de carregamento no navegador é separado de um problema de qualidade da resposta.

Se o navegador indicar um recurso bloqueado, inspecione a mensagem exata de erro de Content Security Policy ou do bloqueador. Evite desativar de forma generalizada as proteções do seu site. Teste a página pública por HTTPS e use a documentação do canal para a configuração necessária.

Quanto custa um chatbot para site?

A assinatura e a franquia de uso cobrem o serviço de IA; o plano do seu site e as integrações opcionais são custos separados.

Um crédito de IA não equivale a uma conversa. Uma conversa pode conter várias respostas da IA, e diferentes escolhas de modelo podem ter custos diferentes em créditos. Inclua Preview e Simulation no orçamento de testes. Use os preços e franquias atuais e o guia de custos de chatbots para estimar seu volume.

ChatGPT ou Claude podem ajudar a configurar o chatbot?

A conexão de gerenciamento de contas do Quickchat AI permite que um assistente compatível configure as opções de Agente suportadas e prepare testes a partir destes artefatos.

Conecte sua própria conta pelo Quickchat AI no ChatGPT ou pelo Quickchat AI no Claude, seguindo o guia Manage with AI. As ferramentas disponíveis abrangem conhecimento, Main Prompt, sugestões de início de conversa, Human Handoff, Actions HTTP, testes e o trecho de código de implantação.

Conclua Smart Data Gathering e as configurações detalhadas de Appearance do widget no painel. Você também precisa autorizar contas externas e instalar o trecho de código nas configurações do seu site. A conexão da conta serve para gerenciar seu Agente; ela é separada da exposição de um Agente como ferramenta MCP.

Use the Kestrel Kitchens website-chatbot kit to prepare a separate learning Agent. Do not change existing Agents. Set its name to Kestrel Kitchens, add knowledge.txt and set main-prompt.txt as Main Prompt. Configure the supported greeting, conversation starters and Human Handoff settings from the kit. Prepare the launch-test dataset with the supplied messages and criteria. Read back the saved configuration and return this Agent's current Widget snippet.
List the remaining dashboard steps for Smart Data Gathering, Appearance and website installation. Do not invent support for those settings. Leave the optional Send quote enquiry Action inactive until I provide my receiver URL and configure its credential. Before running tests or external writes, tell me the expected credit use and effects and obtain any approval required by this client. Do not claim that a website, email or CRM delivery works until it has been tested.

Perguntas frequentes

Como adicionar um chatbot de IA ao meu site?

Crie um Agente no Quickchat AI, adicione o conhecimento da sua empresa, configure Main Prompt, Smart Data Gathering e Human Handoff e instale o Widget usando um plugin ou o trecho de código fornecido. Teste no site publicado uma resposta baseada na fonte, os dados de contato coletados e a entrega de uma resposta humana.

Posso adicionar um ChatGPT personalizado ao meu site?

Você pode adicionar um assistente no estilo ChatGPT treinado com suas próprias páginas. Este tutorial implanta um Agente do Quickchat AI por meio do widget para sites, permitindo que os visitantes conversem no seu site sem fazer login no ChatGPT. O conhecimento, as instruções e as integrações são gerenciados no Quickchat AI.

Posso adicionar um chatbot de IA ao meu site gratuitamente?

O plano Free do Quickchat AI permite aprendizado pessoal e não comercial e inclui 50 créditos de IA por mês. Um site empresarial ou uma implantação de vendas e suporte voltada a clientes precisa de um plano que permita uso comercial. As assinaturas de construtores de sites são separadas, e os testes também consomem créditos de IA.

Preciso programar ou fornecer uma chave de API?

A configuração principal usa opções do painel e um plugin, app embed ou script fornecido. O trecho de código do site contém um Scenario ID público, não uma chave de API privada. Conectar uma Action opcional de CRM exige um endpoint adequado e sua autenticação; mantenha essa credencial nas configurações da Action.

Um chatbot para site pode coletar leads e solicitações de orçamento?

Sim. Smart Data Gathering solicita os campos escolhidos durante a conversa e os salva na Inbox. Email new leads pode notificar os administradores do Agente depois que um endereço de e-mail ou número de telefone é coletado. Uma API Action pode enviar os campos obrigatórios salvos a um receptor configurado; um nome coletado sozinho não caracteriza uma solicitação completa.

Uma pessoa pode assumir o chat?

Sim. Configure Human Handoff com horários de atendimento e uma mensagem para fora do expediente. Na Inbox, selecione Assign to me para uma conversa sem responsável ou Take over quando esse controle aparecer e responda ao visitante. Reassign to AI devolve a conversa ao Agente.

Funciona no WordPress, Shopify, Squarespace, Wix e Webflow?

Cada plataforma tem um caminho de instalação. Use o plugin oficial do WordPress, o app embed da Shopify depois de conectar o Agente da loja ou o trecho de código global adequado no rodapé/fim do body para um Agente existente. As permissões de plugins e os requisitos de plano para código personalizado variam conforme o construtor.

Por que meu chatbot não aparece no meu site?

Verifique a página publicada, o Scenario ID correto e a posição do trecho de código no fim do body da página. Remova instalações duplicadas obsoletas e evite blocos baseados em iframe para o Widget flutuante. Se ele abrir, mas não conseguir responder, verifique Widget & Embed access e os créditos de IA disponíveis.

O chatbot vai deixar meu site mais lento?

O carregador do widget é baixado de forma assíncrona, mas ainda adiciona JavaScript e requisições de rede. Compare o desempenho de carregamento e interação antes e depois da instalação em páginas representativas e em um celular. O carregamento assíncrono não comprova impacto zero no desempenho.

O chatbot do site funciona em celulares?

O widget aberto usa um layout de tela inteira abaixo de 768 pixels CSS. Teste o botão de abertura, o teclado, a rolagem e o controle de fechar em um celular. Deixe Auto-open Widget desativado quando a abertura automática puder interromper a navegação.

O chatbot pode responder nos idiomas dos meus visitantes?

O Agente pode responder no idioma do visitante. Traduzir o texto fixo de boas-vindas, as sugestões de início de conversa e os rótulos do widget é uma configuração separada de plano pago. Teste tanto os fatos da resposta quanto o texto da interface em cada idioma que pretende oferecer.