PrimeEdge 主题教程

搜索

基于 Fuse.js 的站内搜索

搜索

PrimeEdge 的搜索是一个前端弹窗功能：Hugo 构建 /search.json，浏览器加载 Fuse.js 后即时检索。

启用条件

确认 config.toml 中包含：

[outputs]
  home = ["HTML", "RSS", "Search", "FullRSS", "Feed"]

[outputFormats]
  [outputFormats.Search]
    mediaType = "application/json"
    baseName = "search"
    isPlainText = true

构建后访问 /search.json 应能看到 JSON 数组。

搜索范围

默认搜索这些内容类型：

类型显示名称
posts博客
notes笔记
docs文档
good-things好物
investing投资

索引模板位于 layouts/_default/search.json。每条记录包含标题、正文摘要、链接、类型和日期。

使用方式

  • 点击导航栏搜索按钮打开弹窗。
  • 输入至少 2 个字符开始搜索。
  • 点击结果跳转到对应页面。
  • 按 ESC 关闭搜索弹窗。

搜索结果

结果会展示：

  • 内容类型标签
  • 发布日期
  • 标题
  • 命中的正文片段

匹配部分会用 mark 高亮。

自定义搜索

如需调整匹配严格度，编辑 static/js/search.js：

fuse = new Fuse(window.SEARCH_DATA, {
  keys: ['title', 'content'],
  threshold: 0.4,
  includeScore: true,
  includeMatches: true
});

threshold 越小越严格，越大越宽松。

常见问题

Q: 搜索没有结果

  1. 检查 /search.json 是否生成。
  2. 检查 outputs.home 是否使用 Search，不是旧的 JSON。
  3. 检查 Fuse.js CDN 是否加载成功。
  4. 输入至少 2 个字符。

Q: 想排除某类内容

修改 layouts/_default/search.json 中的 slice 内容类型列表。

下一步

评论

0%