Add AI Chat to your Docusaurus docs

plugins: [
  ["@inkeep/cxkit-docusaurus", {
    ChatButton: {
      baseSettings: {
        // see https://docusaurus.io/docs/deployment#using-environment-variables to use docusaurus environment variables
        apiKey: "REPLACE_WITH_YOUR_INKEEP_API_KEY", // required - replace with your own API key
        primaryBrandColor: "#26D6FF", // required -- your brand color, the widget color scheme is derived from this
        organizationDisplayName: "Inkeep",
        // ...optional settings
        theme: {
          // optional path to a custom stylesheet
          styles: [
            {
              key: "main",
              type: "link",
              value: "/path/to/stylesheets",
            },
          ],
          syntaxHighlighter: {
            lightTheme: lightCodeTheme, // optional -- pass in the Prism theme you're using
            darkTheme: darkCodeTheme, // optional -- pass in the Prism theme you're using
          },
        }
      },
      modalSettings: {
        // optional settings
      },
      searchSettings: {
        // optional settings
      },
      aiChatSettings: {
        // optional settings
        aiAssistantAvatar: "/img/logo.svg", // optional -- use your own ai assistant avatar
        exampleQuestions: [
          "Example question 1?",
          "Example question 2?",
          "Example question 3?",
        ],
      },
    }
  }],
],

In this case, the plugin name is @inkeep/cxkit-docusaurus/chatButton.

What this means is that you create a config file in your project. By default, you can create an inkeep.config.js or inkeep.config.ts file in the root of your project, and inkeep will automatically pick it up.

inkeep.config.js

window.inkeepConfig = {
  ChatButton: {
    // ...options
  },
};

You can customize the path to the config file in the plugin options:

docusaurus.config.js

plugins: [
  ["@inkeep/cxkit-docusaurus", { config: "./path/to/my-inkeep-config.js" }],
],

We also export a fully typed defineConfig function that you can use to create your config:

inkeep.config.js

const { defineConfig } = require("@inkeep/cxkit-docusaurus");
 
defineConfig({
  ChatButton: {
    // ...options
  },
});

For a full list of customizations, check out the Common Settings.

Add AI Chat to your Docusaurus docs

What is Docusaurus

Get an API key

Install the Inkeep plugin

Define the widget

Сonfiguration settings

Configure the widget in the plugin `options`

Configure the widget in standalone `config`

FAQ

On this page