Add an AI chat widget to Docusaurus

Installation steps

1. 1

   Prepare

   Copy the script URL and public site key for the docs hostname from MivoChat Install.

2. 2

   Configure

   For a site-wide script, add a script entry in `docusaurus.config.js` with the exact URL and required site key attribute.

3. 3

   Publish

   If the loader needs to be conditionally rendered or customized, swizzle the theme Root component and include the script there once.

4. 4

   Verify

   Build and deploy the docs site, allow the published origin, then test a real docs question and teammate reply.

Use the simplest supported location

Docusaurus supports script configuration in its site config and a theme Root swizzle for global layout behavior. Keep the loader in one place so it does not duplicate across routes.

The `scripts` option accepts a URL or an attribute object, so use `src`, `async: true`, and `data-site` in the same object. If the repository uses TypeScript, edit its existing `docusaurus.config.ts` rather than creating a second config file; preserve the current export and plugin list.

Verify after deployment

Test the deployed docs URL rather than only the local preview. Ask about authentication, an API endpoint, and a missing detail; check that unsupported questions get handed off.

Run the site's production build and inspect a generated page under `build/` for the loader before debugging the widget itself. Then open a nested guide route on the published hostname, use a documented authentication question, and navigate to another docs page without reloading; the widget should remain available and avoid creating a second launcher. For a subpath deployment, approve the public hostname rather than copying the path portion into the origin setting.

Before you change the setup

the Docusaurus config at the repository root, the public site key, and the deployed base URL and hostname

the `scripts` array in `docusaurus.config.js`, with `src`, `async`, and `data-site` attributes

a site-wide config script loads across docs routes; do not add another loader in each MDX page or a swizzled root

Test the support boundary

• Which authorization header does the API require?
• How should a client handle webhook retries?
• Is a behavior documented for this version or only the next release?

Related guidance

If your versioned docs have substantial URL changes, publish redirects before recrawling so old customer links do not point to abandoned pages.

Frequently asked questions