botts.aiDocs

Send to your web agency

If an agency, a freelancer or your IT team looks after your website, send them your embed code with this ready-made message.

You don't have to install the widget yourself. If someone else maintains your website, send them your embed code and they can add it in a few minutes. This page has a message you can copy, plus the technical details they may ask for.

Step 1: Copy your embed code

In botts.ai, open Agents, pick your agent, go to the Deploy tab and open the Website deployment. The Install section at the bottom of the editor shows the code with a copy button. No website deployment yet? See Deployments.

The embed code looks like this, with your deployment's own key in place of YOUR_API_KEY:

<script async src="https://api.botts.ai/widget/chat-widget.js?key=YOUR_API_KEY"></script>

Note

The website widget needs the Business plan or higher. The Personal plan includes the internal chat only.

Step 2: Send this message

Copy the message, replace the placeholder line with your embed code, and send it to whoever maintains your website.

Subject: Please add our botts.ai chat widget to the website

Hello,

Please add our botts.ai chat widget to our website. It is a single
script tag that should load on every page, ideally just before the
closing body tag (the page head works too):

[paste the embed code here]

A few notes:
- Please paste the code unchanged. The key in it belongs to our chatbot.
- The script loads asynchronously and does not block page rendering.
- If the site uses a consent tool, a cache or a script optimizer,
  please make sure it doesn't block or delay the script.
- Technical details: https://botts.ai/docs/install-web-agency

Thank you!

Step 3: Check it once it's live

When they confirm, open your public site in a private window and reload. The chat launcher appears in the bottom-right corner, or wherever you placed it in the widget editor. Open it and send a test question.

Tip

It worked if the widget shows on your public site, opens, and answers your test question.

If it doesn't appear, check that the deployment is switched on in the Deploy tab and test without an ad blocker. If it still doesn't show, ask your agency to check the points in the message.

Colors, texts and every other widget setting are changed in botts.ai afterwards, without involving your agency again. The code on the site only needs replacing if the deployment's key changes.

Technical details for developers

  • What it is: one external script, https://api.botts.ai/widget/chat-widget.js, identified by the key query parameter. The key is a publishable key for this one website deployment; it is meant to sit in public page source.
  • Where: on every page where the widget should appear, ideally just before the closing </body> tag. The script waits for DOMContentLoaded, loads the widget settings and then adds the widget to the body, so the page head works too. Load it once per page.
  • How it renders: the script adds one element, div#bottsai-widget-root, to the page body. In its shadow root it shows the launcher (position: fixed, z-index: 9999) and an iframe that loads the chat window from https://api.botts.ai.
  • Browser storage: the widget keeps a few small entries in the site's localStorage: the open/closed state (bottsai_window_state, bottsai_has_interacted), the ID of the current conversation (botts_conv__ plus the deployment ID) and whether the card launcher was minimized (bottsai_launcher_dismissed__ plus the deployment ID). The conversation itself is stored by botts.ai. The script sets no cookies on the site.
  • Content Security Policy: if the site sends a CSP header, allow https://api.botts.ai in script-src, connect-src and frame-src, and allow 'unsafe-inline' in style-src. The script writes its own styles into the widget's shadow root and has no nonce support. Without this, the launcher loses its styling and the chat window shows up at the end of the page content. If the launcher shows an uploaded logo, also allow https://s3.pub2.infomaniak.cloud in img-src. A policy with require-trusted-types-for 'script' stops the widget from rendering.
  • Voice: if AI voice is on for the widget, the chat iframe uses the microphone (it is embedded with allow="microphone"). If the site sends a Permissions-Policy header with microphone=(), change it to microphone=(self "https://api.botts.ai"). Otherwise voice fails while text chat still works.
  • If nothing appears: check the network requests in the browser's developer tools. A 404 for chat-widget.js means the key doesn't match an active website deployment: it was changed while pasting, or the deployment is switched off with the toggle on its card in the botts.ai Deploy tab.
  • Platform guides: WordPress, Wix, Squarespace, Shopify, Webflow, Jimdo, TYPO3, Google Tag Manager.
  • Removing it: delete the script tag. Nothing else is installed on the site.

Last updated on October 4, 2026