Skip to main content
Version: Stable (v5.x)

Docusaurus adapter

Use @docsearch/docusaurus-adapter to add keyword search, a search results page, Ask AI, and an Ask AI Sidepanel to Docusaurus.

Before you start​

Collect these values:

  • An Algolia application ID.
  • A Search API key with access to your DocSearch indices.
  • At least one DocSearch index name.
  • An Agent Studio assistant ID if you want Ask AI or the Sidepanel. Follow Get started with Agent Studio to create one.

Use Node.js 20 or later, Docusaurus 3.10.2 or later in the Docusaurus 3 release line, and React 18 or 19.

Install the adapter​

Install @docsearch/docusaurus-adapter@^5:

npm install @docsearch/docusaurus-adapter@^5

Keep @docusaurus/preset-classic. Don't add @docusaurus/theme-search-algolia as another search integration.

Add the adapter to plugins. Configure it under themeConfig.docsearch:

docusaurus.config.mjs
export default {
  plugins: ['@docsearch/docusaurus-adapter'],
  themeConfig: {
    docsearch: {
      appId: 'YOUR_APPLICATION_ID',
      apiKey: 'YOUR_SEARCH_API_KEY',
      indices: [{ name: 'YOUR_INDEX_NAME' }],
    },
  },
};

indices is required and must contain at least one index. Use an object to set search parameters for one index:

docusaurus.config.mjs
indices: [
  {
    name: 'docs',
    searchParameters: {
      facetFilters: ['language:en'],
      attributesToRetrieve: [
        'content',
        'hierarchy',
        'type',
        'url',
        'version',
      ],
    },
  },
],

Start Docusaurus and open the search modal. The adapter also creates /search and links to it from the modal. Change or disable that route with searchPage.

Add Ask AI​

Set askAi to an object with your Agent Studio assistant ID:

docusaurus.config.mjs
export default {
  plugins: ['@docsearch/docusaurus-adapter'],
  themeConfig: {
    docsearch: {
      appId: 'YOUR_APPLICATION_ID',
      apiKey: 'YOUR_SEARCH_API_KEY',
      indices: [{ name: 'YOUR_INDEX_NAME' }],
      askAi: {
        assistantId: 'YOUR_ASSISTANT_ID',
      },
    },
  },
};

The adapter uses Agent Studio for Ask AI. Pass an object, not an assistant ID string. It reuses the root appId, apiKey, and first keyword index unless you configure dynamic Agent Studio indices.

Add the Sidepanel​

Set sidePanel at the root of docsearch. You must also configure askAi:

docusaurus.config.mjs
docsearch: {
  appId: 'YOUR_APPLICATION_ID',
  apiKey: 'YOUR_SEARCH_API_KEY',
  indices: [{ name: 'YOUR_INDEX_NAME' }],
  askAi: {
    assistantId: 'YOUR_ASSISTANT_ID',
  },
  sidePanel: true,
},

Pass an object instead of true to configure its placement, width, questions, translations, memory, or indices. The modal and Sidepanel share the DocSearch provider. Review hybrid mode for their responsive behavior.

Next steps​