Blog-修改站点主题以及站点配置文件

觉得官方的主题不太好看,Github上,Hexo官网上都有许多可供选择的主题,我这里使用NexT主题,本文介绍了修改主题的方法以及站点配置文件_config.yml的一些相关配置。

改变主题

下载主题

将需要的主题从Github下载(clone)到你的站点目录中。

1
$ git clone https://github.com/iissnan/hexo-theme-next themes/next

修改站点配置文件

修改你的站点配置文件_config.yml,找到如下字段,只要将theme后面的主题修改为next即可

1
2
3
4
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next

站点配置文件的设置

设置个人头像

个人头像将显示在侧边栏中。在.\source下创建一个images文件夹,将想要设置为头像的图片放于此文件夹中。修改_config.yml,在其中添加如下代码:

1
2
# Head portrait
avatar: /images/cat.jpg

设置站点的基本信息

_config.yml中找到如下字段,配置个人站点的基本信息,下面的出现位置举例基于NexT主题。

1
2
3
4
5
# Site
title: (此处为站点名称,即左上角的名称)
description: (站点描述,将出现在侧边栏头像下方)
author: (作者,将出现在侧边栏头像下方,如果没有修改主题配置文件,同时会出现在网页下方)
language: (界面语言,简体字为zh-Hans)
# 设置置顶文章 找到文件node_modules\hexo-generator-index\lib\generator.js,将文件内容修改为:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
'use strict';
var pagination = require('hexo-pagination');
module.exports = function(locals){
var config = this.config;
var posts = locals.posts;
posts.data = posts.data.sort(function(a, b) {
if(a.top && b.top) { // 两篇文章top都有定义
if(a.top == b.top) return b.date - a.date; // 若top值一样则按照文章日期降序排
else return b.top - a.top; // 否则按照top值降序排
}
else if(a.top && !b.top) { // 以下是只有一篇文章top有定义,那么将有top的排在前面
return -1;
}
else if(!a.top && b.top) {
return 1;
}
else return b.date - a.date; // 都没定义按照文章日期降序排
});
var paginationDir = config.pagination_dir || 'page';
return pagination('', posts, {
perPage: config.index_generator.per_page,
layout: ['index', 'archive'],
format: paginationDir + '/%d/',
data: {
__index: true
}
});
};
发布时需要置顶的文章在前面格式处配置,top值越大越前面:
1
2
3
---
top: 7
---
# 修改文章链接格式 修改permalink样式可以改变自动生成的博文链接样式:
1
2
3
4
5
6
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /
permalink: :title/
permalink_defaults:
# 参考资料