Artigo passo a passo: como adicionar um widget de agente IA ao seu site. Você cria e publica o agente Prostir, abre Channels, escolhe Web widget, adiciona o origin HTTPS exato do seu site, ajusta o chat widget, aperta Save, copia o embed script, cola no site e testa o website chatbot na página real.
No final, seu site carrega um agente IA do Prostir com o widget embed script. Visitantes abrem o chat widget, fazem perguntas, e o mesmo agente publicado responde usando instructions, knowledge, tools, modelo e configurações do canal.
Melhor para
Para founders, agências, criadores, times SaaS, consultores e suporte que querem um website AI agent ou AI chatbot widget sem criar backend, gerenciar API keys no site ou montar um chat próprio.
Onde o trabalho acontece
Widget de agente IA · AI chatbot widget · Chatbot no site · Chat widget
01
O que você precisa antes de começar
Um agente Prostir publicado com channel runtime model explícito, o switch Channels do agente ligado e Model Usage Credits positivos para modelo hospedado ou uma chave BYOK salva.
O origin público exato onde o widget vai rodar, por exemplo https://example.com. Use HTTPS, o subdomínio correto e não cole um caminho como /pricing.
Acesso ao website builder, CMS, tag manager ou template HTML onde você pode colar um script pequeno antes de
ou em um campo de custom code global.
02
Como adicionar o widget de agente IA
O padrão é simples: publique o agente, crie o canal Web widget, aperte Save, copie o script, cole no site e teste a partir do origin permitido.
01
Crie o agente IA no Prostir.
Escreva o que o website agent deve fazer, adicione páginas, FAQs, docs, pricing notes, support rules e tools. Escolha o modelo antes de expor a visitantes.
02
Publique o agente.
O website widget usa o published agent runtime. Se o agente estiver só em draft, o embed script não consegue servir um website chatbot público confiável.
03
Abra Channels e escolha Web widget.
Ligue o switch Channels no agente e selecione Web widget. Não é necessário token externo, mas o canal fica desativado até passar nas verificações de runtime.
04
Adicione allowed origins.
Adicione cada origin HTTPS exato onde o widget pode rodar, como https://example.com e https://www.example.com. O Prostir bloqueia origins externos fora da lista para outro site não reutilizar seu script.
05
Desenhe o chat widget.
Configure position, width, height, colors, greeting text, intro text, input placeholder, launcher label e quick actions. As primeiras ações sugeridas devem refletir perguntas reais: pricing, booking, support, order status ou product fit.
06
Aperte Save.
Save guarda as configurações e ativa o Web widget somente quando passam as verificações de publicação, runtime model explícito, switch Channels do agente, allowed origins, configuração e créditos hospedados ou BYOK. Caso contrário, fica desativado com erro visível.
07
Copie o embed script.
Copie o widgetEmbedUrl retornado. Ele sempre usa o slug publicado e o channel id exato: https://{slug}.ai.prostir.build/widget/embed.js?channelId={id}.
08
Cole o script no site.
Em um site com HTML próprio, cole antes de </body>. Em Webflow, WordPress, Shopify, Wix, Squarespace, Framer ou outro builder, use custom code global, embed code ou custom HTML.
09
Teste no site real.
Abra o domínio permitido real, não um preview URL qualquer. Faça uma pergunta real, revise a resposta e confirme que a conversa aparece em Channels.
03
O que preparar antes de Save
Um bom website AI agent é mais do que uma bolha de chat.
linkallowed originsOrigins HTTPS exatos como https://example.com e https://www.example.com.
docagent instructionsO que o widget responde, o que deve recusar e quando deve chamar uma pessoa.
docwebsite knowledgePricing, services, FAQs, docs, policies, booking details, support rules e source pages.
codeembed scriptO script de uma linha copiado do Prostir: <script src="https://{slug}.ai.prostir.build/widget/embed.js?channelId={id}" async></script>.
04
Passo final no Prostir: Web widget, Save, script
Abra Channels, escolha Web widget, adicione as origens permitidas e pressione Save.
Abra Channels, escolha Web widget, adicione as origens permitidas e pressione Save.
Prostir Studio
Publiquei meu support agent e quero colocar no site como AI chatbot widget.
Abra o agente no Prostir, vá para Channels, escolha Web widget e adicione o origin HTTPS exato do seu site.
O widget deve aparecer no canto inferior direito e começar com perguntas de pricing, booking e support.
Configure position, launcher label, greeting text, quick actions e colors. Aperte Save e copie o embed script.
Prostir
Web widget salvo. O canal só é ativado após todas as verificações de runtime; caso contrário, fica desativado com erro visível.
Use o domínio real listado em allowed origins. Se testar de outro preview origin, o widget pode fail closed por design.
Pergunte o que um lead perguntaria: price, availability, next step, fit, support, refund ou implementation time.
Se a resposta estiver fraca, atualize instructions ou knowledge no Prostir, publique de novo e o widget incorporado usa o agente melhorado sem rebuild do site.
Soluções
Agente de vendas com IA para o site que orienta sem pressionar
Ofereça uma conversa contextual no site e conduza a uma ação clara sem tratar toda visita como oportunidade.
A Managed Code usa cookies opcionais para medir visitas ao site e resultados de anúncios. Escolha «Aceitar tudo» para permitir esses cookies ou «Recusar tudo» para continuar sem eles. Saiba mais na Política de Privacidade e nos Termos de Serviço.