How to add an AI agent widget to your website

• A published Prostir agent with instructions, knowledge, tools, and a selected model.
• The exact public site origin where the widget will run, for example https://example.com. Use HTTPS, include the right subdomain, and do not paste a path like /pricing.
• Access to your website builder, CMS, tag manager, or HTML template where you can paste a small script before </body> or into a site-wide custom-code field.

The pattern is simple: publish the agent, create the Web widget channel, Save, copy the script, paste it into the site, then test from the allowed origin.

1. 01
   Create the AI agent in Prostir.

   Write what the website agent should do, add the pages, FAQs, docs, pricing notes, support rules, and tools it can use. Choose the model before exposing it to visitors.

2. 02
   Publish the agent.

   The website widget uses the published agent runtime. If the agent is still draft-only, the embed script cannot serve a reliable public website chatbot.

3. 03
   Open Channels and choose Web widget.

   In the agent, open Channels, pick Web widget, and keep the channel enabled. No third-party token is needed for the website widget.

4. 04
   Add allowed origins.

   Add each exact HTTPS origin where the widget may run, such as https://example.com and https://www.example.com. Prostir blocks unlisted external origins so another site cannot reuse your widget script.

5. 05
   Design the chat widget.

   Set position, width, height, colors, greeting text, intro text, input placeholder, launcher label, and quick actions. Keep the first suggested actions close to what visitors actually ask: pricing, booking, support, order status, or product fit.

6. 06
   Press Save.

   Save creates or updates the Web widget channel. Prostir keeps the allowed origins, design, channel model settings, and conversation routing together.

7. 07
   Copy the embed script.

   Copy the widget embed script from Prostir. It points at the published agent's typed public surface and may include a channel id when you have more than one widget.

8. 08
   Paste the script on your website.

   For a hand-coded site, paste it before </body>. In Webflow, WordPress, Shopify, Wix, Squarespace, Framer, or another builder, use the site-wide custom code, embed code, or custom HTML area.

9. 09
   Test from the live site.

   Open the actual allowed domain, not a random preview URL. Ask a real question, check the answer, and confirm the conversation appears in Channels.

A good website AI agent needs more than a launcher bubble.

Channels, Web widget, allowed origins, Save.

• Use the real domain listed in allowed origins. If you test from a different preview origin, the widget can fail closed by design.
• Ask the same questions a lead would ask: price, availability, next step, fit, support, refund, or implementation time.
• If the answer is weak, update the agent instructions or knowledge in Prostir, publish again, and the embedded widget picks up the improved agent without rebuilding your website.