写在前面
这个攻略主要是给有一定diy能力的hexo博主。
一些细节的攻略可以参考如下文章:
hexo 基础配置优化
插件进阶
静态代码压缩
文章比较长的情况下网页往往会显示地较慢。因此,需要对静态代码进行压缩,以提高网站的响应速度。
npm install hexo-all-minifier --save
在hexo根目录下的
_config.yml中配置:
# 代码压缩 github.com/chenzhutian/hexo-all-minifier
all_minifier: true
html_minifier:
enable: true
ignore_error: false
exclude:
css_minifier:
enable: true
exclude:
- '*.min.css'
js_minifier:
enable: true
mangle: true
output:
compress:
exclude:
- '*.min.js'
image_minifier:
enable: false # 图片不压缩
interlaced: false
multipass: false
optimizationLevel: 2
pngquant: false
progressive: false
文章加密
插件安装
npm install hexo-encrypt --save
在项目_config.yml中声名默认密码
#该密码为全局默认密码
encrypt:
password: 你的密码
在文章头加入密码配置
encrypt: true
enc_pwd: 你的文章独立密码
在根目录的package.json中追加配置,记得补全“,”
"hexo-encrypt": "^0.2.0"
最终效果
网站顶部进度条
在{hexo-path}/themes/next/layout/_partials/head/head.swig中顶部加入如下代码
<script src="//cdn.bootcss.com/pace/1.0.2/pace.min.js"></script>
<link href="//cdn.bootcss.com/pace/1.0.2/themes/pink/pace-theme-flash.css" rel="stylesheet">
<style>
.pace .pace-progress {
background: #f6a427; /*进度条颜色*/
height: 3px;
}
.pace .pace-progress-inner {
box-shadow: 0 0 10px #1E92FB, 0 0 5px #1E92FB; /*阴影颜色*/
}
.pace .pace-activity {
border-top-color: #1E92FB; /*上边框颜色*/
border-left-color: #1E92FB; /*左边框颜色*/
}
</style>
效果图
利益相关
转载请注明出处,否则我也拿你没办法。