Valine评论头像以及显示失败处理方法

Valine如何显示头像

我们查看Valine的文档,可以发现Valine是使用Gravatar作为评论列表的头像,所以用户想使用头像需要先去注册一个账号,一定要与评论时填写的用户邮箱是一致的。

然后在Hexo的主题文件下,我用的是Next,修改Valine标签。

1
2
3
4
5
6
7
8
9
10
valine:
enable: true
appid: 你的id
appkey: 你的key
notify: false # mail notifier , https://github.com/xCss/Valine/wiki
verify: false # Verification code
placeholder: 留下邮箱我会回复你哦~~~~~ # comment box placeholder
avatar: mp # gravatar style
guest_info: nick,mail,link # custom comment header
pageSize: 10 # pagination size

这里的avatar标签就是设置默认用户的头像。Gravatar提供了几种默认的。mp就是灰色的神秘人头像。可以按照喜好自己更改。

当然,如果在Gravatar上注册好,并上传头像后,一般来说就会显示了,首先要等一段时间,好像是要全球同步的。

配置完成了,但依然未显示头像

我自己注册完Gravatar等了半天都没有成功。百度了半天也没啥解决方法。

这里参考了大佬Bliner’Site的文章,感谢大佬。

我自己是最近才使用Valine所以版本直接是在1.3.4,并没有大佬说的1.2.5版本中,mp被写成mm的问题。检查了每个地方,都是mp并非mm,但是依然无法显示。

hexo部署完后,右键查看图片的地址,可以发现,图片为XXXX.jpg?d=mp&v=1.3.4。我无意中把v=1.3.4去掉了,图片竟然正常显示了。噗

我看大佬说去下最新Valine.min.js,修改代码,然后上传七牛,修改引用js的地址。

我便去下载了最新的js,首先下载的js乱的一比,用idea打开,alt+ctl+l,一键格式化。

然后全局搜索t.verify = e.verify。

找到如下代码

1
g.params = "?d=" + (i.indexOf(a) > -1 ? a : "mp") + "&v=" + o + d, g.hide = "hide" === a, g.cdn = !!c && c || g.cdn, x = e.path || x;

将他修改为

1
g.params = "?d=" + (i.indexOf(a) > -1 ? a : "mp") , g.hide = "hide" === a, g.cdn = !!c && c || g.cdn, x = e.path || x;

也就是去掉&v=1.3.4后缀,即可。

然后就是修改主题文件下的Valine.swig文件,我的next主题文件是在

hexo-theme-next\layout_third-party\comments\valine.swig

打开编辑,你可以看到头部引用的地址,你可以按大佬说的上传七牛,也可以像我这样。

把引用地址指向本地修改为

1
<script src="/js/src/Valine.min.js"></script>

然后将你修改好的Valine.min.js放在主题下的hexo-theme-next\source\js\src,等hexo generate时,会自动编译到public下的js/src这样引用就没有问题了。

快去尝试你的头像吧。~~