Starlight Plugin

Add the Asyntai AI chat assistant to your Starlight docs

Overview

Starlight is the documentation theme for Astro. The Asyntai plugin is an npm package. Add it to your Starlight configuration, build the site, and the chat bubble is on every docs page.

Readers ask a question in the chat and get an answer from your own documentation, in more than 80 languages, day and night.

Requirements

A Starlight site, version 0.30 or later
Node 18 or later
An Asyntai account. The Free plan is enough to try the chat on your docs

Installation

Follow these steps to add Asyntai to your Starlight docs:

Get Your Widget ID

Sign in to Asyntai and open the Install page. The widget ID is the value of data-asyntai-id in the snippet shown there. It starts with asyntai_.

Install the Package

Run this command in your docs project folder:

npm install starlight-ai-chatbot

Add the Plugin

Open astro.config.mjs and add the plugin to Starlight with your widget ID:

import { defineConfig } from 'astro/config';
import starlight from '@astrojs/starlight';
import starlightAiChatbot from 'starlight-ai-chatbot';

export default defineConfig({
  integrations: [
    starlight({
      title: 'My Docs',
      plugins: [starlightAiChatbot({ widgetId: 'asyntai_1a2b3c4d5e6f' })],
    }),
  ],
});

Build the Site

Run npm run build and publish. Open your docs and the chat bubble is in the corner of every page.

Options

Option	Type	Default	What it does
`widgetId`	string	required	Your Asyntai widget ID
`enableInDevelopment`	boolean	`true`	Set it to `false` to keep the chat off the site during `astro dev`
`scriptUrl`	string	the Asyntai CDN	Advanced. Load the widget from another URL

A missing or malformed widgetId stops the build with a message that says how to fix it.

Answering From Your Docs

Asyntai reads your published pages. Add the URL of your docs site in the dashboard, and the assistant answers from the same pages the chat sits on. You can also add documents, and question and answer pairs.

How It Works

The plugin adds the Asyntai loader to every page Starlight builds. The loader waits for the page's load event, so your docs always render first. Search, the sidebar and every other Starlight feature keep working as before.

TypeScript types ship with the package, so astro.config.ts works with no extra setup.

Tip: Set enableInDevelopment: false while you write your docs. The chat then shows up only on the built site.

Removing It

Delete the plugin from astro.config.mjs and build again. The chat bubble is gone.

Plans & Pricing

The plugin is free. View pricing.

Need Help?

If you have any questions or run into issues, contact us at [email protected].

Documentation