前言
这周末偶然提起hexo的一些主题配置,以及一些更加进阶一点的功能,比如环境友好的评论设置,拉高博客逼格的添加音乐等等,所以就开始了折腾之路。
hexo主题
寻找一个简单实用的主题
首先来说说hexo的主题,hexo的主题非常多,但是很多都是大同小异,next是hexo一个比较流行的主题,主题风格极简,主题空间留下大量的空白,适合程序猿的简洁。一开始我也是用next,但是时间久了就觉得有些许单调,所以就开始寻找一个好看又实用的主题。后来我看到了Claudia,第一眼看着感觉比较喜欢它的布局,以及图片的渲染样式,所以就先用着试试看,主题文章布局样式还是比较好看的。
但是后来就慢慢发现这个主题的功能并不是很完整,并不是十分实用,这个主题可以配置的东西偏少点。然后又接着寻找梦里的伊人,material出现了,看了这个主题的样式和使用文档之后,感觉似乎挺不错的,于是准备用material,但是在我的博客上各种方法尝试了多遍却部署不上这个主题,无奈只能放弃。后来就找到了yilia,比较喜欢这个主题的风格,在看了这么多的主题之后还有眼前一亮的感觉,并且看了文档后觉得功能也比较多,于是就决定使用yilia。
关于yilia主题:
1.崇尚简约
2.追求移动端体验
3.希望把加载速度做到极致
4.让大家把注意力放到内容上
5.主题不支持IE6,7,8。以后也不会
主题的使用配置
安装
$ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
配置
修改hexo根目录下的 _config.yml : theme: yilia
更新
cd themes/yilia
git pull
主题详细配置可以看主题目录里面的_config.yml,可以参看作者Litten的配置,使用者可以根据自己的喜好来配置。
添加gitment评论功能
评论系统很多,多说是比较流行的,然而多说倒闭了,网易云跟帖也倒闭了,综合各个评论系统,发现了gitment,完美代替多说。这是原作者的博客,大牛一枚。
1.注册OAuth Application
注册一个新的 OAuth Application。其他内容可以随意填写,但要确保填入正确的 callback URL(一般是评论页面对应的域名,如 https://codegitz.github.io/)。
你会得到一个属于你的 client ID 和一个 client secret
2.引入gitment
稳定版本,如果想开发版的,可以参考原作者博客。
$ npm install --save gitment
配置主题_config.yml文件
Gitment
on: true # 启用gitment评论系统
gitment_owner: codegitz #你的 GitHub ID
gitment_repo: codegitz.github.io #存储评论的 repo
gitment_oauth:
client_id: '3111abe777f17a978418' #client ID
client_secret: 'a793e7d23aa376586e7493cf997ae4b7f3cf5cd7' #client secret
然后部署到GitHub上,再打开文章末尾会看到这个,初始化评论
点击完成初始化,然后就可以开始评论了,评论要先登录GitHub
评论必须要初始化。
添加音乐播放
添加音乐一般可以添加其他网站的外链,一般用的是<iframe>
,但是这个会显示对应的音乐网站名字。
我们用一款HTML5的音乐播放器:Aplayer,使用Aplayer需要使用插件。
命令行安装
npm install hexo-tag-aplayer@2.0.1
安装完成后,在需要添加音乐播放的地方加上,就会出现音乐播放器
{% aplayer "Beautiful In White" "Shane Filan" "http://p0e6ktyto.bkt.clouddn.com/Shane%20Filan%20-%20Beautiful%20In%20White%20%28Demo%29.mp3" "https://i.imgur.com/sRZqFvh.jpg" "autoplay" %}
对应的位置分别是
{% aplayer "歌曲名称" "歌手" "歌曲URL" "封面图片URL" "autoplay" %}
Aplayer的作者还有一款html5的视频播放器,叫Dplayer,对应有一款hexo的插件,叫hexo-tag-dplayer,这里还没有用到,以后再看看。
歌曲的地址可以存放的七牛云上,加载速度嗖嗖嗖的。
注册七牛云的流程我就不说了,可以看注册使用
七牛云的使用还有为博客添加高清大图,十分方便。
注册之后可以使用存放歌曲,视频等文件,使用方法如下
上传成功后就可以获得文件外链
复制这个外链放到需要使用的地方,例如歌曲URL那里
最后
这两天花了不少时间在这个上面,不能使用material主题实在是有点遗憾,不过yilia也十分好看实用,弥补了一下遗憾。关于视频播放器Dplayer的使用,下次再来踩踩。