前言

Valine是一个很好的评论系统,今天我发布这篇文章主要是为了让小白少掉一些坑,先来看看成果😆:

还挺不错的吧

教程

如果您不嫌弃鄙人的当然也可以直接用😙
效果可以在我的博客评论区点击表情预览
链接:https://pan.baidu.com/s/1XbmZXCfBZddANNzVzPhIxw
提取码:r0ol

首先确定你的valine版本是在1.4.5之上的,因为在这之后valine才支持自定义表情,我的主题是Sakura,自带的版本是1.3.5,低版本的,所以就要去官方下载,可以挑自己喜欢的版本

点击上面的Source code(zip)下载压缩包,下载后找到里面的Valine.min.js将其移到myblog-sakura\themes\Sakura\source\js目录下,然后在blog\myblog-sakura\themes\Sakura\layout\_partial\footer中找到valine.min.js的引用,将其改为本地引用,可以搜索valine,将这一句引用改成:

  <script src='/js/valine.min.js'></script>

你也可以在commit.ejs中应用,都一样,只不过Sakura默认是在footer.ejs中,之后更改下载好的js文件内容:搜索smile找到表情部分:

这是我更改后的样子,默认的是压缩性的,找到这一部分后,就可以在这里面添加表情了,注意这里默认的接口是https://img.t.sinajs.cn/t4/appstyle/expression/ext/normal/,首先要更改成自己的接口,可参考文章:点击我,这是一个现成的表情仓库,直接引用即可,不过如果引用了这个,就不能添加自己想要的了,如果想添加自己想要的,就要收集所有表情到GitHub仓库里面,使用JsDeliver引用,如果有不会JsDeliver的可以百度,很多教程,不过这个过程可能有点麻烦,我是个很懒的人 😆,改完以后,使用

hexo clean && hexo g && hexo s

命令预览一下,没问题部署到远程仓库就ok了

另外新版的valine是支持qq头像的,在评论名称处打上你的QQ号发表评论直接默认是你的qq头像,很NICE!

ending~ 撒花。

参考文档

Valine官方文档

其他详细教程

Uncle_drew -《valine添加自定义表情》

Valine详细介绍


一个好奇的人