Hexo 博客安装 Fluid 主题

本文最后更新于:2022年9月29日 下午

一.主题

使用 hexo 推荐选择一款自己喜欢的主题,主题带有一些额外的功能适配,不需要自己去做,比如评论、友链、访问统计。可以浏览官方网站来选择自己喜欢的主题:https://hexo.io/themes/。

我是用的主题是 Fluid,我就以此主题为例来给大家演示如何安装主题。

Fluid

二.安装

下面的命令默认在博客根目录执行

通过命令安装

1
npm install --save hexo-theme-fluid

修改 Hexo 博客目录中的 _config.yml

1
2
3
theme: fluid  # 指定主题

language: zh-CN # 指定语言,会影响主题显示的语言,按需修改

创建 关于 页

1
hexo new page about

创建成功后修改 /source/about/index.md,添加 layout 属性。

修改后的文件示例如下:

1
2
3
4
5
6
---
title: 标题
layout: about
---

这里写关于页的正文,支持 Markdown, HTML

如果主题有更新,可以通过如下命令更新:

1
npm update --save hexo-theme-fluid

现在通过命令 hexo s 来预览你新安装的主题啦

三.开启友链

可以和你的好友博客之间交换友链哦,Fluid 提供的友链的功能。

image-20220705020951652

配置 _config.fluid.yml

1
2
menu:
- { key: "links", link: "/links/", icon: "iconfont icon-link-fill" }

加入 links 链接,然后就可以在导航栏看到 友链

添加或删除友链,配置 _config.fluid.yml:

1
2
3
4
5
6
7
8
9
10
11
links:
enable: true
# 友链的成员项
# Member item of page
items:
- {
title: "晓晨Master",
intro: "晓晨的博客园",
link: "https://www.cnblogs.com/stulzq/",
avatar: "/img/favicon.png"
}

四.增加留言板

执行命令添加页面

1
hexo new page remark    

编辑 source/remark/index.md

1
2
3
4
5
6
7
---
title: 留言板
date: 2022-06-29 12:36:00
comment: '评论插件'
---

欢迎留言,请留下邮箱方便我回复您!

评论插件的开启放在下一节

添加留言板到导航,配置 _config.fluid.yml:

1
2
menu:
- { key: "remark", link: "/remark/" }

五.开启评论插件

评论插件推荐使用 twikoo

image-20220705022157095

具有自动拉取 QQ 头像功能,防垃圾,实时通知、邮件通知、管理后台,IP 归属地显示等功能。

官方的安装文档很详细,此处不赘述:https://twikoo.js.org/

安装后 twikoo 评论系统以后,需要配置 _config.fluid.yml:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# 文章页面评论

post:
comments:
enable: true
type: twikoo

# 友链页面评论

links:
comments:
enable: true
type: twikoo

# 配置参数
twikoo:
envId: <envid>
region: ap-shanghai
path: window.location.pathname

推荐配置完成以后开启,评论防垃圾,过滤政治、黄赌毒等敏感言论,同时配置钉钉、邮件等实时通知。在后台管理配置即可,带有详细的主题,如有不会的可以在在本文留言。

六.结束

本文所有主题配置都和博客使用的一样,欢迎访问查看:https://zhiqiang.li


Hexo 博客安装 Fluid 主题
https://zhiqiang.li/posts/40019.html
作者
李志强
发布于
2022年7月5日
许可协议