Hexo 是一个快速、简洁且高效的博客框架,支持个性化的配置。这篇博文记录了搭建过程。
目录
配置主题
修改博客工程根目录下的_config.yml
文件
theme: hexo-theme-next
配置风格
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
scheme: Mist
配置语言
修改博客工程根目录下的_config.yml
文件
language: zh-Hans
配置描述
修改博客工程根目录下的_config.yml
文件
description: "Stay hungry, Stay foolish."
配置目录
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
toc:
enable: true
number: false
配置头像
将头像图片文件123.jpg
放进/source/images中,修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
avatar:
url: /images/123.jpg
配置拉条
none
配置社交
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
social:
E-Mail: mailto:jaydenhuanggz@gmail.com || envelope
配置打赏
将打赏图片文件wechatpay.jpg
放进/source/images中,修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
reward_comment: “如果觉得还不错,请我喝杯咖啡吧~”
wechatpay: /images/wechatpay.jpg
配置菜单
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
menu:
home: / || home
tags: /tags/ || tags
categories: /categories/ || th
配置标签
增加一个页面(page)用来汇总标签
hexo new page tags
修改生成的页面文件内容(/source/tags/index.md)
---
title: tags
date: 2019-05-10 13:49:39
type: "tags"
---
给文章添加标签
属性
---
title: 博客个性化配置
date: 2019-05-10 10:00:00
tags:
- 博客
- 搭建
- 环境
- 配置
---
配置分类
增加一个页面(page)用来汇总类别
hexo new page categories
修改生成的页面文件内容(/source/categories/index.md)
---
title: categories
date: 2019-05-10 13:44:06
type: "categories"
---
给文章添加类别
属性
---
title: 博客个性化配置
date: 2019-05-10 10:00:00
categories:
- 社交
---
配置评论
next主题集成了许多第三方厂家的评论功能插件,选择比较精简的Valine。
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件,主要是app id
, app key
和visitor
。
valine:
enable: true
appid: xxxxxxxxxx
appkey: xxxxxxxxxx
guest_info: nick,mail
notify: true
placeholder: Comment here ...
visitor: true
增加评论区之后,根据valine的文章阅读量统计方法增加统计数据
找到/themes/hexo-theme-next/layout/_third-party/comments/valine.swig
文件并修改代码
修改前:
<script>
var GUEST = ['nick', 'mail', 'link'];
var guest = '{{ theme.valine.guest_info }}';
guest = guest.split(',').filter(function(item) {
return GUEST.indexOf(item) > -1;
});
new Valine({
el: '#comments',
verify: {{ theme.valine.verify }},
notify: {{ theme.valine.notify }},
appId: '{{ theme.valine.appid }}',
appKey: '{{ theme.valine.appkey }}',
placeholder: '{{ theme.valine.placeholder }}',
avatar: '{{ theme.valine.avatar }}',
meta: guest,
pageSize: '{{ theme.valine.pageSize }}' || 10,
});
</script>
修改后:
<script>
var GUEST = ['nick', 'mail', 'link'];
var guest = '{{ theme.valine.guest_info }}';
guest = guest.split(',').filter(function(item) {
return GUEST.indexOf(item) > -1;
});
new Valine({
el: '#comments',
verify: {{ theme.valine.verify }},
notify: {{ theme.valine.notify }},
appId: '{{ theme.valine.appid }}',
appKey: '{{ theme.valine.appkey }}',
placeholder: '{{ theme.valine.placeholder }}',
avatar: '{{ theme.valine.avatar }}',
meta: guest,
pageSize: '{{ theme.valine.pageSize }}' || 10,
visitor: {{ theme.valine.visitor }},
});
</script>
配置分享
修改博客工程根目录下的_config.yml
文件
baidushare: true
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
baidushare:
type: button
按照链接中的方法,将static放进/themes/hexo-theme-next/source
目录下。
修改baidushare.swig
文件中的代码。
修改前:
.src='//bdimg.share.baidu.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];
修改后:
.src='/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];
配置版权
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
post_copyright:
enable: true
修改博客工程根目录下的_config.yml
文件
url: https://jaydenh215.github.io/
配置脚注
修改主题目录(/themes/hexo-theme-next)下的_config.yml
文件
footer:
powered:
enable: false
theme:
enable: false
配置统计
next主题集成了许多第三方厂家的统计功能插件,选择LeanCloud。
完成上述步骤之后,会发现阅读次数
后面没有数字,那是因为LeanCloud
和next
主题还没有联系起来,
需要按照该博主的方法来实现。
配置搜索
TBD
博文置顶
最新的next貌似不需要下载新的插件,直接改hexo-theme-next/layout/_macro/post.swig
就可以了
博文插图
修改博客工程根目录下的_config.yml
文件
post_asset_folder: true
marked:
prependRoot: true
postAsset: true
这样每次hexo new XX,都会同时生成一个XX文件夹用来放图片。
为了去掉插图的边框,找到/themes/hexo-theme-next/source/css/_common/components/post/post-expand.styl
文件并修改代码。
img {
box-sizing: border-box;
margin: auto;
padding: 0px;
border: 0px;
}