Docusaurus Plugin Theme

The first step is to install the plugin using your prefered method (npm, yarn, or pnpm).

Modify your docusaurus.config.js file to include the plugin.

docusaurus.config.js
export default {
  // ...
  themes: [
    [
      require.resolve('@trieve/docusaurus-search-theme'),
      {
        apiKey: 'tr-********************************',
        datasetId: 'd5d098bd-****-****-****-************',
        defaultSearchQueries: [
          'How to deploy Docusarus',
          'Troubleshooting search',
          'Difference between helm?',
        ],
        defaultAiQuestions: [
          'Quickstart Guide',
          'How to swizzle search component',
          'Compiling static assets',
        ],
        brandLogoImgSrcUrl: 'https://cdn.trieve.ai/favicon.ico',
        brandName: 'Trieve',
        brandColor: '#3c8dcc',
        responsive: true,
        debounceMs: 50,
      },
    ]
  ],
  // ...
};

The second item in the array is the configuration object for the plugin.

For more props and customization options, see Parameters.