chatbots
By Saurav | Founder of saavos | Building in public toward $10k MRR
[!TLDR] This is the master guide. You can add an AI chatbot to your website in under 5 minutes using a managed platform — paste your URL, get an embed snippet, drop it before
</body>. The three embed approaches, platform-specific walkthroughs (Webflow, Shopify, WordPress, plain HTML), training best practices, and UX rules are all here. For platform-specific depth, specialist guides are linked throughout — see the index below.
An AI chatbot in 2026 is trained on your specific content — your pricing pages, FAQ, product docs — and answers visitor questions by retrieving the relevant section and feeding it to a frontier model like Claude or GPT-4o. This is called retrieval-augmented generation (RAG). It is not a rule-based decision tree. It is not a generic ChatGPT iframe with no idea what your business sells. The difference between a useful chatbot and a frustrating one is whether the answers are grounded in your actual content, with citations a visitor can verify.
This post covers the full setup. Each linked guide goes deeper on one piece of the stack.
Getting live on your platform
Training your bot well
Making it reliable
Putting it to work
Vertical deep-dives
For 95% of small SaaS teams, ecommerce stores, and indie founders, the managed-platform-plus-embed path is the right answer. You paste a URL, get a script tag, drop it into your site HTML, and you're live. The other two options — custom RAG build and copy-paste static iframe — exist, but the custom build takes 2–8 weeks of engineering and the static iframe gives you no grounding in your actual content.
| Approach | Setup time | Technical skill | Cost | Customization | Accuracy |
|---|---|---|---|---|---|
| Managed platform + embed widget | 5 minutes | None | $0–$199/mo | Medium — colors, position, greeting | High when fed clean sources |
| Custom build (LangChain, your own RAG) | 2–8 weeks | Python/JS engineer | Hosting + model API | Total | Depends on your engineering |
| Copy-paste static widget (e.g. ChatGPT iframe) | 2 minutes | None | Free | Almost none | Low — no grounding in your content |
The managed path hands over the work that's annoying and brittle — chunking strategy, embedding pipelines, vector search, citation rendering, mobile widget UX, model API quotas — and you keep ownership of what matters: the content, the brand, and the conversations.
Sign up on a managed platform, paste your site URL, wait 1–2 minutes for ingestion, then copy the one-line script tag and paste it before the closing </body> tag in your site HTML. The five steps, in order:
You want a platform where Step 1 is "paste your URL." Not "upload a CSV of FAQs." Not "wait for our team to onboard you." If you're evaluating, look at saavos, Chatbase, Wonderchat, or Botsonic — all four ingest a URL, crawl your public pages, and chunk + embed them in a single click. The ones that ask you to upload your content manually are still useful, but they cost you 30 minutes you didn't need to spend.
Feed it the URL of your site. The platform will crawl your public pages — typically 20 to 200 of them depending on plan limits — and turn the content into chunks of about 500 tokens with 50 tokens of overlap. If you have content the public crawler can't see (pricing PDFs, internal handbooks you've extracted, customer-facing Notion pages), upload those as additional sources. Mix sources to cover what your live site does not.
Crawling is fast — usually under a minute. The slow part is the embedding step, where each chunk gets converted into a 1,536-dimensional vector using a model like OpenAI's text-embedding-3-small. For a 50-page site this takes another 1–2 minutes. Most platforms show a live progress bar so you know it's working.
Set the bot's name, write a friendly greeting, add 3–4 suggested starter questions, pick a brand color for the launcher button, and — this is the one most people skip — write a fallback message for queries the retrieval can't answer. Something like "I'm not sure about that — email us at support@yourbusiness.com and we'll get back to you within an hour" is infinitely better than letting the model hallucinate an answer it has no source for.
Every modern platform gives you a one-line script tag. On saavos it looks like this:
<script src="https://saavos.com/embed.js" data-bot="your-slug" defer></script>
The defer attribute is important — it lets the page render first and the widget load after, so it has zero impact on Largest Contentful Paint. The chat panel itself is loaded as an iframe only when the visitor clicks the launcher, so it contributes nothing to Interaction to Next Paint either. Drop the snippet right before the closing </body> tag and you're live.
The script tag goes before the closing </body> on every platform. The only variation is how each platform exposes that location — through a UI settings panel (Webflow, WordPress plugins) or by editing a theme file (Shopify). Total time is 3 minutes on any of these once you have the tag in hand.
In the Webflow Designer, open Site Settings → Custom Code → Footer Code and paste the script tag. Save, then publish. The widget appears on every page of your site instantly. If you need it only on specific pages (say, just the pricing page), use page-level custom code under each page's settings instead.
For the full Webflow walkthrough including z-index handling and page-level vs site-wide deploy decisions, see How to embed a chatbot on Webflow without code.
From your Shopify admin, go to Online Store → Themes → ⋯ → Edit Code. Open theme.liquid and find the closing </body> tag near the bottom of the file. Paste the script tag right before it. Save the file. The widget loads on every customer-facing page, including product pages, cart, and checkout (though Shopify's checkout is a separate domain, so the widget won't appear there — that's a Shopify limitation, not a chatbot one).
For store-specific training decisions (what to include from your product catalog) and the checkout limitation workaround, see Shopify chatbot setup in 2026.
The cleanest path is the free WPCode plugin (formerly Insert Headers and Footers). Install it, go to Code Snippets → Header & Footer, and paste the script tag into the Footer box. Save. If you'd rather edit theme files, drop the snippet just before </body> in your theme's footer.php, but use a child theme so an update doesn't wipe it.
Paste the script tag directly before the closing </body> tag in every page that should show the widget — or, if you have a shared layout/include, paste it once there. That's the entire install.
A few implementation details separate chatbot widgets visitors actually use from widgets they dismiss in 3 seconds. Token-by-token streaming is the most important: answers appear as they generate, not after a 4-second wait. Inline citations with hover preview let visitors verify that "we ship to 40 countries" is backed by your actual shipping page, not invented. Follow-up suggestions after each answer keep the conversation moving. And on a 375px viewport, the chat panel should take the full screen with a clear close button — not a cramped pop-up.
saavos ships all of these by default. So do most of the modern competitors — if a platform you're evaluating doesn't, that's a signal it hasn't been updated in a while.
Most chatbot failures trace back to two mistakes: training on marketing content instead of factual content, and not configuring a fallback message. Everything else is recoverable. These two will produce a bot that confidently makes things up, which is worse than no chatbot.
Train on your pricing page, FAQ, product docs, and shipping or returns policy. Exclude blog posts, homepage hero copy, and testimonials — content written to acquire a prospect makes poor retrieval material because it is vague by design. Three to five tightly-scoped factual pages outperform a full site crawl. Expand only after reviewing the first two weeks of conversation logs.
A bot trained on your marketing homepage gives vague answers. A bot trained on your docs, pricing page, and FAQ gives specific ones. The rule: include every page a customer would benefit from reading; exclude every page written to attract a prospect.
For the full training guide — PDF uploads, URL crawling, chunk sizing, what to exclude — see How to train a chatbot on your PDF knowledge base and How to train ChatGPT on your website data.
To understand why your bot might still hallucinate after careful training — and how to fix it — see How to prevent AI chatbot hallucinations in 2026.
Track deflection rate: how many conversations resolved without a fallback or human handoff. Teams that train on factual sources and set a real fallback typically reach 30–60% deflection within 90 days. Measure ticket volume vs your pre-bot baseline — your support inbox should drop within 30–60 days of launch. Pick a platform that surfaces conversation logs and source attribution per answer; without those, you're guessing.
Ship the bot, then block 30 minutes at end of week 1 to read every conversation it had. You'll immediately see which questions it missed, which answers were too long, and which visitor questions you didn't anticipate. Fix those. Don't wait for month 3.
For the full measurement framework and what separates teams that hit the high end of deflection from those stuck at 10–20%, see How to reduce customer support tickets with an AI chatbot.
saavos is built around exactly this 5-minute path — paste your URL, get a working bot, embed it anywhere. Start free — no credit card needed — or see our pricing for what each tier includes.
Get the next post in your inbox
Honest writing on building, embedding, and shipping AI chatbots. No spam. Unsubscribe anytime.
Sign up on a managed platform like saavos, paste your site URL, wait 1–2 minutes for ingestion, then copy the one-line script tag and paste it before the closing </body> tag in your site HTML. On Webflow: Site Settings → Custom Code → Footer Code. On Shopify: edit theme.liquid, find </body>, paste before it. On WordPress: use the WPCode plugin. Total setup time: under 5 minutes.
No, if the script loads with the defer attribute. The saavos widget script is under 4 KB and runs after the page has parsed, so it has zero effect on Largest Contentful Paint. The chat panel itself is loaded as an iframe only when the visitor clicks the launcher — it costs zero on pages where no one opens it.
Train on your pricing page, FAQ, product docs, and shipping or returns policy. Avoid blog posts, homepage hero copy, and testimonials — content written to acquire a prospect makes poor retrieval material because it is vague by design. Three to five tightly-scoped factual pages outperform a full site crawl. Expand only after reviewing the first two weeks of conversation logs.
Two controls: first, scope the training sources to factual content only (pricing, FAQ, docs) and exclude marketing copy. Second, configure a fallback message for when retrieval finds no good match — something like "I'm not sure, email us at support@yourbusiness.com." A visible honest dead-end beats a hallucinated answer. For a full prevention guide, see the hallucination prevention post linked in the complete chatbot setup guide.
Yes. Most managed platforms — including saavos, Chatbase, and Wonderchat — accept PDF uploads alongside URL ingestion. Upload pricing PDFs, internal handbooks, and customer-facing spec sheets to cover content your public site does not expose. The platform converts the PDF to chunks and embeds them the same way it handles web pages. Mix sources: URL crawl for live content, PDF for everything behind a login or not yet published.
Builds tools for solopreneurs and small SaaS teams who don't have an afternoon to spare.
Paste your URL. Train your bot. Drop one script tag. No credit card.