Facebook Docusaurus 中文文档启用搜索

最新推荐文章于 2024-12-06 11:51:58 发布

weixin_34220179

最新推荐文章于 2024-12-06 11:51:58 发布

阅读量822

点赞数

CC 4.0 BY-SA版权

原文链接：https://segmentfault.com/a/1190000012889034

本文介绍如何在Docusaurus网站上配置Algolia搜索功能，包括启用搜索、自定义搜索栏位置及禁用搜索等步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

此系列文章的应用示例已发布于 GitHub: docusaurus-docs-Zh_CN. 可以 Fork 帮助改进或 Star 关注更新. 欢迎 Star.

启用搜索

Docusaurus 支持使用 Algolia DocSearch 进行搜索。一旦你建立了你的网站，输入你的网站信息来让 Algolia 抓取你网站的文档页面。 Algolia 会向您发送您的网站的 API 密钥和索引名称。

启用搜索栏

在 algolia 部分的 siteConfig.js 中输入您的搜索 API 密钥和索引名称，以启用您的网站搜索。

const siteConfig = {
  ...
  algolia: {
    apiKey: "my-search-only-api-key-1234",
    indexName: "my-index-name"
  },
  ...
}

额外搜索参数

您还可以在 algolia 中使用algoliaOptions字段指定额外的 Algolia 使用的搜索参数。如果您想为文档的不同版本或语言提供不同的搜索结果，这可能会很有用。任何 "VERSION" 或 "LANGUAGE" 都将被当前页面的版本或语言所取代。关于搜索选项的更多细节可以在这里找到。

const siteConfig = {
  ...
  algolia: {
    ...
    algoliaOptions: { 
      facetFilters: [ "tags:VERSION" ], 
      hitsPerPage: 5 
    }
  },
}

控制搜索栏位置

默认情况下，搜索栏将是顶部导航栏中最右边的元素。

如果您想更改默认位置，请在 siteConfig.js 的 headerLinks 字段中将 searchBar 标志添加到您想要的位置。例如，您可能需要在内部和外部链接之间的搜索栏。

const siteConfig = {
  ...
  headerLinks: [
    {...}
    {...}
    { search: true }
    {...}
    {...}
  ],
  ...
}

禁用搜索栏

要禁用搜索栏，请注释掉（推荐）或删除 siteConfig.js 文件中的 algolia 部分。

另外，如果您在 headerLinks 中自定义了搜索栏的位置，请设置 search: false。

如果这篇文章对您有帮助, 感谢下方点赞或 Star GitHub: docusaurus-docs-Zh_CN 支持, 谢谢.

Facebook Docusaurus 中文文档 启用搜索