Hexo,NexT 配置「站内搜索功能」

前言

  • 本来这个网站是没有做搜索功能的,文章暂时没那么多,😁😁😁😁😁😁。
  • 后来发现,写着写着居然分页了,之后想着为了方便做了个站内搜索吧。
  • 检索的插件用的是 Algolia,NexT ,集成的样式还说的过去。

Algolia 配置

  • Algolia 详细公司介绍请读者自行查找吧,网上有很多
  • 请去 Algolia 官网 注册账号,认证邮箱。
  • 创建 Index,点击 NEW INDEX
  • 如图:


  • 创建 INDEX ,名称最好以 dev_ 开头,例如 dev_Test

  • 如图:

Algolia 安装


主站 _config.yml 配置

  • 打开博客主目录下 _config.yml 编辑

  • 在最下方加入:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    algolia:
    applicationID: ‘Application ID’
    apiKey: ‘Search-Only API Key’
    adminApiKey: ‘Admin API Key’
    indexName: ‘申请名称’
    chunkSize: 5000
    fields:
    - title
    - slug
    - content:strip
  • 如图:


  • 找到 url 配置如下:
    1
    url: 换成读者自己访问的域名,或者链接

查看 Algolia Key

  • 查看 algolia Key

NexT, 配置 _config.yml 配置

  • 打开博客主目录下 themes/next/_config.yml 编辑

  • 找到 algolia_search 配置如下:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    algolia_search:
    enable: true
    hits:
    per_page: 10
    labels:
    input_placeholder: 输入关键字搜索
    hits_empty: “没有找到与 ${query} 相关的内容”
    hits_stats: “搜索到 ${hits} 条相关记录,共耗时 ${time} ms”

  • 打开终端进入博客根目录输入命令:

    1
    hexo algolia 
  • 成功如下图:


Tips

  • 如果终端输入 hexo algolia 报错如下 :

    1
    2
    ERROR [Algolia] Please set an HEXO_ALGOLIA_INDEXING_KEY environment variable to enable content indexing.
    ERROR >> Read https://npmjs.com/hexo-algolia #api-key for more informations.
  • 如图:


  • 不要惊慌,终端博客目录下输入:

    1
    2
    export HEXO_ALGOLIA_INDEXING_KEY=Admin API Key 
    #Admin API Key 可以在读者自己申请的 Algolia 中复制出来

  • 主站下的 _config.yml 配置文件中需要修改字段 url, 换成读者自己访问的域名,如果不换搜索,搜索到文章点击跳转,跳转不到对应的文章。

  • 配置主站 “_config.yml” 文件时需要注意缩进格式,不然会提示错误,错误信息如下:
    1
    ERROR [Algolia] Please provide an Algolia index name in your hexo _config.yml file. ERROR >> Read https://npmjs.com/hexo-algolia#public-facing-search-options for more informations.