Hugo 配置系列-2:一行命令带走烦恼
修改 default.md
site_name\archetypes\default.md
修改模板样式
|
|
Algolia 搜索
前往 Algolia 官网,注册账号,并且获取
APP_ID
,ADMIN_KEY
,INDEX_NAME
三个信息在
site_name
目录里,新建.evn
文件,存放 Algolia 信息1 2 3 4
ALGOLIA_APP_ID=B********S ALGOLIA_ADMIN_KEY=8******************************5 ALGOLIA_INDEX_NAME=h***********d ALGOLIA_INDEX_FILE=public/index.json
安装 atomic-algolia,自动更新索引信息
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
# 安装npm sudo apt-get install npm # 优化安装体验 npm cache clear --force npm config set registry https://registry.npmmirror.com # 安装 atomic-algolia,方便在生成静态文件的时候,同时更新搜索的索引 cd site_name npm -g install atomic-algolia # 配置 package.json npm init # 完成后会生成一个 package.json 文件,打开它 vim package.json
在
scripts
中添加"algolia": "atomic-algolia"
1 2 3 4
"scripts": { "test": "echo \"Error: no test specified\" && exit 1", "algolia": "atomic-algolia" },
npm run algolia
运行,测试是否成功配置之后有新文章的时候,使用
hugo && npm run algolia
即可
刷新 CDN
点击 「刷新目录」的 API 文档,然后进入调试,登录过后就进入到了 API 云编辑平台了
输入自己的要刷新的网址,输入刷新类型,然后选择「nodejs」,最后下载工程
将下载的文件夹保存到服务器中,可以保存到
site_name
路径,也可以保存到其它路径。然后将压缩包解压,然后进去配置环境:1
npm install tencentcloud-sdk-nodejs-cdn --save
打开文件夹中的
package.json
,将package.json
中涉及scripts
的部分内容保存到site_name/package.json
相同的位置,同时将node
后面的相对路径改为绝对路径:打开下载文件夹里面的
src/sample.js
文件,将$SECRET_ID
、$SECRET_KEY
进行替换成自己的 ID 和 KEY。获得方法:在第二步网页中点击「查看密钥」,根据指引生成密钥过后,将其填写到src/sample.js
中。运行:
npm run qcloudcdn
,显示如下图,就表示成功的刷新了 CDN,也可以前去官网上查询是否正在更新中。
设置百度统计
在
config.toml
中找到[params.analytics]
,然后新建一个百度统计1 2 3 4 5 6 7 8 9 10 11 12
[params.analytics] # 这里要设置为 true 才可以使用哦 enable = true [params.analytics.google] id = "" # whether to anonymize IP # 是否匿名化用户 IP anonymizeIP = true # Fathom Analytics # 百度统计,自己配置的 [params.analytics.baidu] id = ""
将
themes
中的\themes\LoveIt\layouts\partials\plugin\analytics.html
拷贝到\layouts\partials\plugin\analytics.html
。打开拷贝后的
analytics.html
文件,在Fathom Analytics
的代码下面加上如下内容:1 2 3 4 5 6 7 8 9 10 11 12
{{- /* Baidu Analytics */ -}} {{- with $analytics.baidu.id -}} <script> var _hmt = _hmt || []; (function () { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?{{ . }}"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> {{- end -}}
前往百度统计里面,添加自己的网址,然后拷贝
id
,粘贴到步骤 1 的[params.analytics.baidu]
的id
中。最后生成静态文件,到百度统计中的代码安装检查,查看是否配置成功。
Console报错找不到 site.webmanifest
到 Favicon Generator 上传自己的网站图标,最后会下载一个压缩包,里面包括各种大小的图标和 browserconfig.xml
、site.webmanifest
等文件,将这些文件放到 blog\static
中即可。
三重备份,防止意外发生
输出流
我平时的内容是在 Notion 中进行产出的,偶尔使用 wolai。当我的内容里有图片的时候,我会使用 typora 打开从前面了两个平台导出的 markdown 文件,将图片自动的上传到腾讯对象存储的存储桶中,然后将其内容使用 vscode 连接主机,开启 hugo 草稿预览,查看效果,如果不错的话就上传到博客中。
笔记软件内容保存
前面提到,我会使用 Notion 或者 wolai 进行撰写,它俩会保存我的内容到云端,当作我的一个备份点。
Gitea 自建代码库保存
因为国内网络环境,所以自己使用 Gitea 快速搭建了一个代码仓库,使用其将自己的内容进行备份。作为参考,给出我的备份的内容,有 /
的为文件夹,没有的则是文件:
archetypes/ | config.toml | content/ | package.json | layouts/ | assets/ | static/ |
---|---|---|---|---|---|---|
Hugo 模板 | 主题配置文件 | 文章内容 | Algolia 和 qcloudcdn 配置文件 | 存着百度统计的 html | 各种定制 scss,js | 存放着一些图标 |
Github 备份
虽然因为网络原因不好备份,不过在网络还算可以的时候,还是需要将在 Gitea 保存的内容再一次进行备份,防止因为自己操作问题,导致自建仓库内容丢失。
如何快速的对两个仓库进行备份?
备份是一个非常好的习惯,但是我会因为备份的各种操作,就慢慢的放弃了备份,当未来面临文件丢失的时,才后悔莫及。所以对于我来说,备份的门槛一定要足够的低,才能让我愿意坚持下去。转到 Hugo 之后,我利用 alias
、git
,成功实现了用一个命令,完成了更新文章、刷新 CDN、更新 Algolia 索引,还同时将内容备份到两个仓库。所以我们一起来看看吧。
保证
public
生成得最简,所以先删除:rm -rf public
使用
hugo --minify
生成public
将生成的
public
里面的内容复制到/var/www/html/public
,所以得sudo cp -r /root/raylanyao/public/* /var/www/html/public
使用
npm run algolia
更新搜索索引使用
npm run qcloudcdn
刷新 CDN使用
git add archetypes/ config.toml content/ package.json layouts/ assets/ static/ && git commit -m "$1" && git push -u origin main
这里有个小技巧,打开
~/.git/config
,将两个仓库的git
链接放到一块儿,这样就可以同时更新两个仓库了
然后将上面的5条命令进行组合:
1 2 3 4 5 6
alias hugos="rm -rf public && hugo --minify && copy_public && npm run qcloudcdn && gitbackup" alias hugo_aligolia="rm -rf public && hugo --minify && copy_public && npm run algolia && npm run qcloudcdn && gitbackup" # cp public alias copy_public='sudo cp -r /root/raylanyao/public/* /var/www/html/public' # git backup alias gitbackup='backup(){git add archetypes/ config.toml content/ package.json layouts/ assets/ static/ && git commit -m "$1" && git push -u origin main;};backup'
可以自行选择自己需要的进行组合,适合自己的就最好,我的命令中,
hugo_aligolia
实现了上面说的一个命令完成所有的事情。
以上就是全部内容了,希望对你有所帮助。