The snippet
This is everything you need.
<script defer data-bot-slug="YOUR-BOT-SLUG" src="https://saavos.com/embed/widget.js"></script>
Replace YOUR-BOT-SLUG with the slug from your saavos dashboard. That is the complete install — nothing else to configure.
How to install
Three steps. Under a minute.
01 — Create your bot and train it on your URL
Sign up at saavos.com/signup and paste your site URL. The crawler reads your public pages and trains the bot in under a minute. Copy your bot slug from the dashboard Settings tab.
02 — Paste the script tag before </body>
Open your HTML file (or template if you use a static site generator) and paste the snippet just before the closing </body> tag. Works with Astro, Hugo, Jekyll, Eleventy, plain HTML, or any framework that produces HTML output.
03 — Publish — bot appears bottom-right
Deploy your site as normal. The saavos widget loads asynchronously after the page is interactive — it does not block rendering, does not affect your Lighthouse score, and adds less than 2 KB to your page weight on first load.
How it works
Vanilla JS. No dependencies.
01 — Pure vanilla JavaScript
The widget is written in plain JS with no framework dependency. It works in every browser that supports ES2020 — Chrome, Firefox, Safari, Edge. No React, no Vue, no Svelte required on your page.
02 — Deferred and async — zero layout shift
The defer attribute means the script executes after your HTML is parsed. No render-blocking, no CLS, no impact on LCP. The widget injects a single shadow-DOM element that does not interfere with your styles.
03 — Isolated styles via Shadow DOM
The chat widget lives inside a Shadow DOM boundary. Your CSS does not leak in; the widget CSS does not leak out. No style conflicts, no !important overrides, no specificity wars regardless of your CSS framework.
Customization
Theme, position, greeting. All customization is done through data-* attributes on the script tag — no JavaScript config object required.
<script defer data-bot-slug="YOUR-BOT-SLUG" /* required */ src="https://saavos.com/embed/widget.js" data-position="bottom-right" /* bottom-right | bottom-left */ data-theme-color="#000000" /* any hex color */ data-greeting="Hi! How can I help?" /* opening message */></script>
Any site. Any stack. One tag.
No-card preview included. No card required — train your bot on your site URL and paste the snippet in under five minutes. Try free or ask a question.