hexo next主题

​ 搭建好自己的博客之后,接下来就可以对自己的博客进行装饰了(没有搭建博客的可以去搭建个人博客去学习如何搭建),下面的文章就教大家如何美化自己的博客。

1 安装Next主题

克隆整个Next仓库(在Git Bash输入以下代码 二选一即可)

1
2
3
克隆代码(Next不同版本使用不同仓库)
git clone https://github.com/next-theme/hexo-theme-next themes/next
git clone git@github.com:next-theme/hexo-theme-next.git themes/next

2 配置文件

在 Hexo 中有两份主要的配置文件,其名称都是 _config.yml。 其中,一份位于站点根目录下,主要包含 Hexo 本身的站点配置;另一份位于主题目录下,这份配置由主题作者提供,主要用于配置主题相关的选项。为了描述方便,在以下说明中,将前者称为 站点配置文件, 后者称为 主题配置文件.

1
2
3
4
站点配置文件
/hexo/_config.yml
主题配置文件
/hexo/themes/next/_config.yml

修改站点配置文件_config.yml,找到如下代码:

1
2
## Themes: https://hexo.io/themes/
theme: landscape

landscape修改为next即可。

3 切换主题

next 主题自带四种样式

在主题配置文件/next/_config.yml中查找:scheme,找到如下代码:

1
2
3
4
5
6
# Schemes
scheme: Muse
#scheme: Mist
#scheme: Pisces
#scheme: Gemini
选择你喜欢的一种样式,去掉前面的 #,其他主题前加上 # 即可。

4 修改语言

打开站点配置文件,搜索 language,找到如下代码:

1
2
3
author:
language:
timezone:

在 language 后面输入 zh-CN

5 新建标签以及分类界面

打开 主题配置文件,搜索 menu,找到如下代码:

1
2
3
4
5
6
7
8
9
menu:
home: / || home
#about: /about/ || user
#tags: /tags/ || tags
#categories: /categories/ || th
archives: /archives/ || archive
#schedule: /schedule/ || calendar
#sitemap: /sitemap.xml || sitemap
#commonweal: /404/ || heartbeat

把 tags 和 categories 前面的 # 删除。

5.1 创建分类、标签目录文件

因为分类页、标签页是没有默认页面的所以需要我们手动创建分类页

5.1.1 创建分类页

进入博客项目所在的文件夹下,打开Git Bash执行以下命令

1
$ hexo new page categories

成功后会提示:

1
INFO  Created: ~/blog/source/categories/index.md

然后根据以上提示路径(~/blog/source/categories/index.md打开index.md这个页面文件,里面默认内容为

1
2
3
4
---
title: 文章分类
date: 2021-01-25 22:37:25
---

我们需要添加上type: "categories"这段代码就能让主题识别该页面为分类页面了

1
2
3
4
5
---
title: 文章分类
date: 2021-01-25 22:37:25
type: "categories"
---

这样我们就完成了分类页面的配置了。

5.1.2 创建标签页

进入博客项目所在的文件夹下,打开Git Bash执行以下命令

1
$ hexo new page tags

成功后会提示:

1
INFO  Created: ~/blog/source/tags/index.md

然后根据以上提示路径(~/blog/source/tags/index.md打开index.md这个页面文件,里面默认内容为

1
2
3
4
---
title: 标签
date: 2021-01-25 22:37:25
---

我们需要添加上type: "categories"这段代码就能让主题识别该页面为标签页面了

1
2
3
4
5
---
title: 标签
date: 2021-01-25 22:37:25
type: "tags"
---

这样我们就完成了标签页面的配置了。

5.1.3 给文章设置标签属性

首先打开需要添加标签的文章,在文章里添加上以下文案,就设置好标签里了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//设置单标签
---
tags:
- Facebook配置
---

//设置多标签 并同时设置分类
---
categories:
- web
tags:
- Android
- RecyclerView
---

如上表示给这篇文章添加categories: - web 这个分类。然后我们就可以在博客到分类里看到该分类了。

如下图所示

效果图

------ 本文结束 感谢您的阅读------