Hugo添加Algolia搜索支持
![这篇文章介绍了如何在Hugo上添加Algolia搜索支持。
以 LoveIt 主题为例。 /hugo-algolia/featured-image.png](/hugo-algolia/featured-image.png)
目录
这篇文章介绍了如何在Hugo上添加Algolia搜索支持。
以 LoveIt 主题为例。
系统环境
- Windows 10
- hugo_extended_0.68.3_Windows-64bit
1 注册账户
Algolia官网:https://www.algolia.com/
按步骤注册即可
2 创建空索引
注册成功后系统会引导创建应用和索引,如果未创建,请手动创建
流程如下:
- 创建应用
- 选择免费的方案
- 选择服务器所在地
- 创建空索引
3 配置API Keys
点击导航栏API Keys
,记录信息(Application ID, Search-Only API Key, Admin API Key)
在config.toml
中进行配置
|
|
4 生成索引文件
使用hugo
命令后,public文件夹下生成index.json
文件
5 上传索引文件
5.1 手动上传
点击Upload Record(s)上传索引文件
- 第一次上传需要继续配置可搜索属性
- 自定义排序规则(Custom Ranking)可以暂时不做配置
5.2 自动上传
- 在
blog
目录下执行以下命令
|
|
执行完后会生成 node_modules
文件夹(如果代码托管在 GitHub 的话,可以在.gitignore中添加/node_modules
以忽略该文件)。在项目根目录下还会有一个package.json
文件,打开该文件,在scripts
下添加"algolia": "atomic-algolia"
后如下:
|
|
在博客项目根目录下建立一个.env文件,文件内容如下:
请按照自己的应用进行配置
|
|
执行下面的命令更新Algolia:
|
|
6 效果展示
启动测试环境
|
|