这是 Windows 系统使用 Hexo 搭建博客系列文章:
- 配置本地环境;
- 连接网络;
- 博客配置和主题配置;
- 博客写作;
这是第三篇:博客配置和主题配置。
1. 博客配置和写作
1.1 修改博客名称
在 /blog/_config.yml
中的 #Site
修改:
- title
- subtitle
- description
- language: zh-CN
- timezone
注意:若使用 NexT 主题,language 的简体中文必须设置为 zh-CN
1.2 生成 Category, Tags, About 页面
- 输入:
1
2
3hexo new page tags
hexo new page categories
hexo new page about
然后在 source 文件夹下会出现 tags, categories, about 文件夹,分别在里面的 index 文件加入语句:1
2
3type: "tags"
type: "categories"
type: "about"
在 about 文件夹里面的 index.md 写个人的简介。
1.3 添加搜索和 RSS Feed
注意,必须首先安装了 Hexo 的 feed 和 searchdb 插件,在 /blog/_config.yml
中添加如下代码:1
2
3
4
5
6
7
8
9
10
11
12search:
path: search.xml
field: post
format: html
limit: 10000
feed:
type: rss2
path: rss2.xml
limit: 10
hub:
content: 'true'
注意,search 还必须在 NexT 主题配置文件中把 local_search
设为 true
.
1.4 为项目主页添加 README 文件
每次 Hexo 重新部署的时候项目主页的 README 文件都会被删除。因此用如下方法:
- 在
\blog\source
文件夹内新建文件README.mdown
; - 在这个
README.mdown
里面写 readme 的内容。
2. NexT 主题配置
主要使用和参考了:
2.1 基础设置
首先修改主题:在博客配置文件 /blog/_config.yml
里面修改主题为:theme: next
;
接下来操作都在主题配置文件 /blog/themes/next/_config.yml
中进行。
- 网页设置
- 网站小图标(
# Site Information Settings
):把图标的 png 文件放在themes/next/source/images/
文件夹里面,把文件夹的链接加到favicon:
中即可。我只设置了 small, medium 两个; - 设
creative_commons:
的post: true
,在文末添加版权声明; - 网页底部
footnote
暂不作设置。
- 网站小图标(
- 设置导航栏(
# Menu Settings
):添加 about, tags 和 categories; - 设置模板(
# Scheme Settings
):可选择喜欢的样式,我采用了Gemini
; - 设置侧边栏(
# Sidebar Settings
),我的修改如下:- 设置社交账号链接(
social
):设置了 Github,知乎,豆瓣和邮箱四个; - 设置
back2top
中的值都为 true; - 增加头像(
avatar
):把头像放在themes/next/source/images/
文件夹里面,把文件夹的链接加到url:
中即可; - 修改
toc
设置,把自动添加目录序号设为number: false
;
- 设置社交账号链接(
- 设置文章(
# Post Settings
):可设置文后添加微信订阅、相似文章等,但现暂时不设置; - 添加数学公式支持(
# Math Equations Render Support
)- 设置
math
为enable: true
; - 卸载原来的 renderer:
npm un hexo-renderer-marked --save
; - 安装可以支持 mathjax 的 renderer:
npm install hexo-renderer-pandoc --save
; - 每次写作,如果需要使用公式(mathjax)时,就在声明区加入声明:
mathjax: true
- 设置
2.2 高级设置
- 添加评论支持:
使用来必力评论系统(LiveRe),先注册。然后点击安装
,选择免费版,填入网站链接和名称,获得代码,找到uid
。最后在主题配置文件中找到livere_uid:
并加入即可; - 添加阅读次数统计功能:
使用 Leecloud,用 Github 账号注册之后,创建新应用(自定应用名)→ 进入应用,创建 class,名字为 Counter → 设置,应用 key → 复制 App ID 和 App Key → 修改主题配置文件中的leancloud_visitors
。最后需要安装插件npm install hexo-leancloud-counter-security --save
; - 添加顶部加载进度条:
进入\themes\next
文件夹,输入:git clone https://github.com/theme-next/theme-next-pace source/lib/pace
下载插件。在主题配置文件中把pace
设为true
即可; - 添加背景动态效果:
主题配置文件定位到# Canvas-nest
,看情况是否需要。并且要安装插件; - 修改文章底部的 # 号标签
修改模板/themes/next/layout/_macro/post.swig
,搜索rel="tag">#
,将其中的#
换成<i class="fa fa-tag"></i>