写在前面
Hexo 为我们提供了大量的 Plugins 以供需要使用,这些包通过npm install
命令可以一键便捷地集成到我们的网站中。大家可以根据个人胃口食用之。因此,本文只是作为一个引子展示 Hexo 有广泛的个性化定制支撑。毕竟,博客作为一个记录功能的存在,我们希望它的建设更加丰富多样的同时不要占据我们太多的工作和学习时间。Time is Money。
安装组件并配置
-
直接通过官方命令
npm install hexo-douban --save
安装。 -
站点根目录下的
/_config.yml
配置文件末尾加上如下代码:1
2
3
4
5
6
7
8
9
10
11
12
13douban:
user: 214963638 # 你的豆瓣ID
builtin: true # 将生成页面的功能嵌入hexo s和hexo g中
book:
title: '读后感'
quote: 'This is my book quote'
movie:
title: '观后感'
quote: 'This is my movie quote'
#game:
#title: 'This is my game title'
#quote: 'This is my game quote'
timeout: 10000 # 爬取数据的超时时间,也即超时报错(ETIMEOUT)等待时间 -
通过命令
hexo clean && hexo douban -bgm && hexo g -d && hexo s
开启豆瓣的数据导入,其中-bgm
代表的是 books、games、movies 三个参数,根据需要酌情食用。ps:
builtin
参数设置为true
将hexo douban -bgm
内嵌入hexo g -d
或hexo s
中,方便网页的下次生成和部署。 -
在主题配置文件
/themes/pure/_config.yml
中添加 menu 按钮及其图标代码。1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25menu:
Home: /
Archives: archives # 归档
Categories: categories # 分类
Tags: tags # 标签
Publications: /publications
Repository: repository # github repositories
Books: books # 豆瓣书单
Movies: movies # 豆瓣电影
Links: links # 友链
About: about # 关于
# Enable/Disable menu icons
menu_icons:
enable: true # 是否启用导航菜单图标
home: icon-home-fill
archives: icon-archives-fill
categories: icon-folder
tags: icon-tags
publications: icon-list
repository: icon-project
books: icon-book-fill
movies: icon-douban
links: icon-friendship
about: icon-cup-fill
常规 Bug 的解决方案
数据导入(hexo douban -bgm
)可能出现的常规报错[1]如下所示:
1 | INFO 0 books have been loaded in 2177 ms, because you are offline or your network is bad |
首先利用node --version
检查当前版本,然后通过sudo npm install n -g
安装 node 的管理模块,最后通过命令sudo n 12.18.1
安装 v12.18.1 版本的node.js
解决上述网络问题导致的 bug。
参考资料
[1] Hexo博客加入豆瓣
[2] 在Hexo博客中加入豆瓣读书页面
[3] node版本降级(mac下)