前言

Hugo 添加 Algolia 搜索, 本文以 LoveIt 主题为例

LoveIt 启用 Algolia 搜索

  • 添加以下代码在你的 config.toml, 根据自己情况填写
[params]
 [params.search]
  enable = true
  # 搜索引擎的类型 ("lunr", "algolia")
  type = "algolia"
  # 文章内容最长索引长度
  contentLength = 4000
  # 搜索框的占位提示语
  placeholder = ""
  # LoveIt 新增 | 0.2.1 最大结果数目
  maxResultLength = 10
  # LoveIt 新增 | 0.2.3 结果内容片段长度
  snippetLength = 50
  # LoveIt 新增 | 0.2.1 搜索结果中高亮部分的 HTML 标签
  highlightTag = "em"
  # LoveIt 新增 | 0.2.4 是否在搜索索引中使用基于 baseURL 的绝对路径
  absoluteURL = false
  [params.search.algolia]
    index = ""
    appID = ""
    searchKey = ""
[outputs]
  home = ["HTML", "RSS", "JSON"]

获取 Algolia 相关配置

创建属于 Hugo 的 Application

  1. 名称随便填一个, 例如 Hugo
  2. CHOOSE YOUR SUBSCRIPTION –> 选择免费的 FREE
  3. 点击右侧 —> Next Step:Data Center
  4. 选择一个离你网站地方进的地方

获取 index

  • 回到主页

    1. 点击左下角的 Data sources
    2. 选择你刚才注册的 Application
    1. 点击左上角 Indices
    2. 点击右上角 Greate Index
    3. 填一个名称, 例如 Hugo, 之后在 config.toml 配置 index

获取 appID

获取 searchKey

上传到 Algolia

  1. 在你的Hugo主目录下运行:
    hugo
  2. public 目录下会生成 index.json
  3. 将 index.json 上传到你的 Algolia index 中

自动化上传 index.json

  • 需要安装 npm, nodejs
  • Nodejs

你的 Hugo 目录下安装 atomc-algolia

npm install atomic-algolia --save

你的 Hugo 目录下新建 .env 文件

  • 内容为, 请根据自己信息填写, 每一项缺一不可
ALGOLIA_APP_ID=
ALGOLIA_INDEX_NAME=""
ALGOLIA_INDEX_FILE="public/index.json"
ALGOLIA_ADMIN_KEY=

开始自动上传

  • hugo
  • 自动生成 public 目录
  • npm run algolia

添加不同语言的搜索

  • 在 Algolia 同个 Application 创建两个 index
  • 不同语言有不同的 index.json
  • 请在下方找到对应的 search 配置
  • 参考配置
    # [en, zh-cn, fr, pl, ...] 设置默认的语言
defaultContentLanguage = "zh-cn"

[languages]
  [languages.en]
    weight = 1
    title = "ISouthRain"
    languageCode = "en"
    languageName = "English"
    [[languages.en.menu.main]]
      identifier = "posts"
      pre = ""
      post = ""
      name = "Posts"
      url = "/posts/"
      title = ""
      weight = 1
    [[languages.en.menu.main]]
      identifier = "tags"
      pre = ""
      post = ""
      name = "Tags"
      url = "/tags/"
      title = ""
      weight = 2
    [[languages.en.menu.main]]
      identifier = "categories"
      pre = ""
      post = ""
      name = "Categories"
      url = "/categories/"
      title = ""
      weight = 3
    [languages.en.params.search]
      enable = true
      # 搜索引擎的类型 ("lunr", "algolia")
      type = "algolia"
      # 文章内容最长索引长度
      contentLength = 4000
      # 搜索框的占位提示语
      placeholder = ""
      # LoveIt 新增 | 0.2.1 最大结果数目
      maxResultLength = 10
      # LoveIt 新增 | 0.2.3 结果内容片段长度
      snippetLength = 50
      # LoveIt 新增 | 0.2.1 搜索结果中高亮部分的 HTML 标签
      highlightTag = "em"
      # LoveIt 新增 | 0.2.4 是否在搜索索引中使用基于 baseURL 的绝对路径
      absoluteURL = false
      [languages.en.params.search.algolia]
        index = "" # 根据你创建的 index 名, 例如 Hugo-en
        appID = "" # 添加自己的
        searchKey = "" # 添加自己的


  [languages.zh-cn]
    weight = 2
    title = "ISouthRain"
    # 网站语言, 仅在这里 CN 大写
    languageCode = "zh-CN"
    languageName = "简体中文"
    # 是否包括中日韩文字
    hasCJKLanguage = true
    [[languages.zh-cn.menu.main]]
      identifier = "posts"
      pre = ""
      post = ""
      name = "文章"
      url = "/posts/"
      title = ""
      weight = 1
    [[languages.zh-cn.menu.main]]
      identifier = "tags"
      pre = ""
      post = ""
      name = "标签"
      url = "/tags/"
      title = ""
      weight = 2
    [[languages.zh-cn.menu.main]]
      identifier = "categories"
      pre = ""
      post = ""
      name = "分类"
      url = "/categories/"
      title = ""
      weight = 3
    [languages.zh-cn.params.search]
      enable = true
      # 搜索引擎的类型 ("lunr", "algolia")
      type = "algolia"
      # 文章内容最长索引长度
      contentLength = 4000
      # 搜索框的占位提示语
      placeholder = ""
      # LoveIt 新增 | 0.2.1 最大结果数目
      maxResultLength = 10
      # LoveIt 新增 | 0.2.3 结果内容片段长度
      snippetLength = 50
      # LoveIt 新增 | 0.2.1 搜索结果中高亮部分的 HTML 标签
      highlightTag = "em"
      # LoveIt 新增 | 0.2.4 是否在搜索索引中使用基于 baseURL 的绝对路径
      absoluteURL = false
      [languages.zh-cn.params.search.algolia]
        index = "" # 根据你创建的 index 名, 例如 Hugo-zh
        appID = "" # 添加自己的
        searchKey = "" # 添加自己的

请享受🍔🍟

FAQ❓

  • 遇到了问题?
    • 请在下方回复