1.博文置顶
- 打开
Hexo 站点下node_modules/hexo-generator-index/lib/generator.js文件。代码全部替换为：
'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的排在前面（这里用异或操作居然不行233）
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字段,设置数值，数值越大文章越靠前
---
layout: layout
title: 标签1
date: 2017-08-18 15:41:18
tags: 标签1
top: 100
---
2.统计功能，统计功能,显示文章字数统计,阅读时长,总字数
count.png
- 在你站点的根目录下
$ npm i --save hexo-wordcount
- 打开
themes/next下的_config.yml，搜索关键字post_wordcount
# Post wordcount display settings
# Dependencies: https://github.com/willin/hexo-wordcount
post_wordcount:
item_text: true
#字数统计
wordcount: true
#预览时间
min2read: true
#总字数,显示在页面底部
totalcount: false
separated_meta: true
3.修改文章内文本连接样式
link.png
- 打开
themes/next/source/css/_custom/下的custom.styl,添加代码
// 文章内链接文本样式
.post-body p a{
color: #0593d3;
border-bottom: none;
border-bottom: 1px solid #0593d3;
&:hover {
color: #fc6423;
border-bottom: none;
border-bottom: 1px solid #fc6423;
}
}
4.每篇文章末尾统一添加“本文结束”标记
end.png
- 在路径
/themes/next/layout/_macro中新建passage-end-tag.swig文件,并添加以下内容：
{% if not is_index %}
------ 本文结束------
{% endif %}
- 打开
themes/next/layout/_macro/下的post.swig文件,添加：
{% if not is_index %}
{% include 'passage-end-tag.swig' %}
{% endif %}
- 然后打开
主题配置文件_config.yml,在末尾添加：
# 文章末尾添加“本文结束”标记
passage_end_tag:
enabled: true
5.文章顶部显示更新时间
- 打开
主题配置文件_config.yml,搜索关键字updated_at设置为true
# Post meta display settings
post_meta:
item_text: true
created_at: true
updated_at: ture
categories: true
- 编辑文章,增加关键字
updated
---
layout: layout
title: 关于
date: 2017-08-18 15:41:18
updated: 2017-09-05 20:18:54 #手动添加更新时间
6.修改访问URL路径
- 默认情况下访问URL路径为：
domain/2017/08/18/关于本站,修改为domain/About/关于本站 - 编辑
Hexo 站点下的_config.yml文件，修改其中的permalink字段
permalink: :category/:title/
7.给代码块添加复制功能
- 下载插件clipboard.js
- 打开
themes/next/source/lib/,新建文件夹clipboard - 把下载
clipboard.js下的src文件夹下的文件拖动到clipboard文件夹下 - 打开
themes/next/source/js/src/,新建文件custom.js,代码如下:
//此函数用于创建复制按钮
function createCopyBtns() {
var $codeArea = $("figure table");
//查看页面是否具有代码区域，没有代码块则不创建 复制按钮
if ($codeArea.length > 0) {
//复制成功后将要干的事情
function changeToSuccess(item) {
$imgOK = $("#copyBtn").find("#imgSuccess");
if ($imgOK.css("display") == "none") {
$imgOK.css({
opacity: 0,
display: "block"
});
$imgOK.animate({
opacity: 1
}, 1000);
setTimeout(function() {
$imgOK.animate({
opacity: 0
}, 2000);
}, 2000);
setTimeout(function() {
$imgOK.css("display", "none");
}, 4000);
};
};
//创建 全局复制按钮，仅有一组。包含：复制按钮，复制成功响应按钮
//值得注意的是：1.按钮默认隐藏，2.位置使用绝对位置 position: absolute; (position: fixed 也可以，需要修改代码)
$(".post-body").before('