Cómo añadir un widget de agente IA a tu web

• Un agente Prostir publicado con instrucciones, knowledge, tools y modelo elegido.
• El origin público exacto donde se ejecutará el widget, por ejemplo https://example.com. Usa HTTPS, el subdominio correcto y no pegues una ruta como /pricing.
• Acceso al website builder, CMS, tag manager o plantilla HTML donde puedes pegar un pequeño script antes de </body> o en un campo de custom code global.

El patrón es directo: publicas el agente, creas el canal Web widget, pulsas Save, copias el script, lo pegas en la web y pruebas desde el origin permitido.

1. 01
   Crea el agente IA en Prostir.

   Escribe qué debe hacer el website agent, añade páginas, FAQs, docs, pricing notes, support rules y tools. Elige el modelo antes de mostrarlo a visitantes.

2. 02
   Publica el agente.

   El website widget usa el published agent runtime. Si el agente sigue solo en draft, el embed script no puede servir un website chatbot público fiable.

3. 03
   Abre Channels y elige Web widget.

   En el agente, abre Channels, selecciona Web widget y deja el canal enabled. El website widget no necesita token externo.

4. 04
   Añade allowed origins.

   Añade cada origin HTTPS exacto donde puede correr el widget, como https://example.com y https://www.example.com. Prostir bloquea origins externos no listados para que otro sitio no reutilice tu script.

5. 05
   Diseña el chat widget.

   Configura position, width, height, colors, greeting text, intro text, input placeholder, launcher label y quick actions. Las primeras acciones sugeridas deben parecerse a preguntas reales: pricing, booking, support, order status o product fit.

6. 06
   Pulsa Save.

   Save crea o actualiza el canal Web widget. Prostir guarda juntos los allowed origins, design, channel model settings y conversation routing.

7. 07
   Copia el embed script.

   Copia el widget embed script desde Prostir. Apunta a la superficie pública typed del agente publicado y puede incluir channel id si tienes varios widgets.

8. 08
   Pega el script en tu web.

   En una web con HTML propio, pégalo antes de </body>. En Webflow, WordPress, Shopify, Wix, Squarespace, Framer u otro builder, usa custom code global, embed code o custom HTML.

9. 09
   Prueba desde la web real.

   Abre el dominio permitido real, no un preview URL cualquiera. Haz una pregunta real, revisa la respuesta y confirma que la conversación aparece en Channels.

Un buen website AI agent es más que una burbuja de chat.

Channels, Web widget, allowed origins, Save.

• Usa el dominio real incluido en allowed origins. Si pruebas desde otro preview origin, el widget puede fail closed por diseño.
• Pregunta lo que preguntaría un lead: price, availability, next step, fit, support, refund o implementation time.
• Si la respuesta flojea, actualiza instructions o knowledge en Prostir, publica otra vez y el widget embebido usará el agente mejorado sin reconstruir la web.