toMedia
搜索

Algolia

在 Fumadocs 中集成 Algolia 搜索

本文档介绍将 Algolia 搜索与 Fumadocs UI 集成。建议使用 Algolia 的客户端 SDK 构建自定义搜索,同时也提供了内置对话框界面以供即插即用。

设置流程

实现 Algolia 搜索需要三个配置值:appIdapiKeyindexName

设置包括:

  1. 创建客户端组件,导入 Algolia 的 lite 客户端和 Fumadocs 搜索组件
  2. 初始化 Algolia 客户端,传入凭据
  3. 使用 useDocsSearch hook,type 设为 'algolia' 并传入客户端配置

注意:useDocsSearch() 不使用 instant search(Algolia 的官方 JavaScript 客户端)。

与 RootProvider 集成

自定义搜索对话框通过 <RootProvider /> 配置替换默认搜索。对于 Server Component,需要将 provider 包装在单独的客户端组件中以正确传递函数引用。

标签过滤(可选)

可选功能,通过标签过滤搜索结果。需要服务端标签过滤配置和客户端使用 useState 管理选中标签的状态。

On this page