【Valine】: 一种快速,简洁且高效的无预设评论系统。
Valine诞生于2017年8月7日,是一种基于LeanCloud的快速,简洁且高效的无标题评论系统。
理论上支持但不限于静态博客,目前已有Hexo,Jekyll,Typecho,Hugo,Ghost等博客程序在使用Valine
安装Valine
主题已集成Valine
PS: 不过目前大多数主题都已集成Valine
在主题根目录下的配置文件-config.yml
文件中启用Valine
并在配置项里填入appid
和appkey
的值即可
主题未集成Valine
在主题目录_partial
下新建valine.ejs
文件,有的可能需要新建在_partial/component/
或者_partial/post/
下
<div id="vcomment" class="comment"></div> |
在comments.ejs
文件的</div>
前新增
<%- partial('valine') %> |
没有此文件则新建一个,写入如下代码
<div class="comments <%= className %>"> |
再在layout.ejs
中</body>
之前引入
<% if (theme.post.showComments && page.layout === 'post'){ %> |
完成以上,再到主题配置文件-config.yml
下引入配置
valine: |
comments.ejs
的代码可能要引入到article.ejs
或者post.ejs
中去,即不需要建comments.ejs
文件。
配置使用
获取appid
和appkey
由于其是基于LeanCloud的无后端的评论系统,所以我们需要去注册【LeanCloud】获取appid
和appkey
。
注册账号后即可创建一个应用
若使用国内版需要邮箱激活,并且实名认证,推荐使用国际版。
进入刚刚创建的应用→设置→选择应用 Keys,即可能看到AppID
和AppKey
快速部署
原版的Valine并不能满足我的需求,而Valine Admin 是 Valine 评论系统的扩展和增强,主要实现评论邮件通知、评论管理、垃圾评论过滤等功能。
所以使用的是 DesertsP大佬的【Valine-Admin】!
环境变量和web域名设置
在刚刚创建的应用后台→云引擎→设置,添加环境变量以及web域名
环境变量参数说明,除可选外其余为必填项,以下变量一定要保证正确!!!
变量 | 示例 | 说明 |
---|---|---|
SITE_NAME | Senorui’s Blog | 站点名称 |
SITE_URL | https://senorui.top | 站点地址 |
SMTP_USER | xxxx@senorui.com | SMTP登录用户 |
SMTP_PASS | xxxxxx | SMTP登陆密码 |
SMTP_SERVICE | Yandex | 邮件服务提供商,支持QQ、163、126、Gmail以及更多 |
SENDER_NAME | Senorui | 收件人 |
SENDER_EMAIL | xxxx@senorui.com | 发件邮箱 |
AKISMET_KEY | xxxxxxxxxxxx | (可选)Akismet Key 用于垃圾评论检测,注册 |
TEMPLATE_NAME | default | 邮件主题,default & rainbown两种 |
在应用后台,设置→安全中心→Web 安全域名,设置使用域名即可
云引擎部署
在应用后台,部署→部署项目→Git部署,填写Git地址https://github.com/DesertsP/Valine-Admin.git
,分支选择master,点击部署即可。
测试以下邮件通知是否正常
测试正常,邮箱能正常收到评论通知,OVER!!!
在应用后台,设置→邮件模板处添加邮件模板,保证网站访问者和站长均能收到回复的邮件。
主题名
(。・∀・)ノ゙嗨!你在{{appname}}的文章收到了新的评论 |
内容:
<p>Hi, {{username}}</p> |
评论美化
(∪.∪ )…zzz
如何美化!超小白的我也是参考了大佬的博文,对本站主题进行了一点点点点的适配。
【博客Valine评论样式美化】: https://bestzuo.cn/posts/763113948.html
在此感谢大佬的分享!!!
表情包
官方的1.4+版本的Valine已经支持自定义表情包,可参阅【官方文档】
大佬的JS里已经集成了众多的表情包,直接使用即可
评论框背景图片
在博客CSS文件里加入评论样式代码即可
#veditor { |
让评论头像有动态性,给添加头像图片旋转效果
/* 头像图片旋转效果 */ |
博主、小伙伴、访客标识
这个要魔改的Valine才支持,此魔改版支持
添加博主,小伙伴,访客标签
添加浏览器和操作系统图标,需引入 fontawesome v5.0+ 的 CSS 样式
邮箱检测更严格(配合AKISMET效果更佳)
增加 QQ 邮箱识别并拉取QQ头像
可自定义meta placeholder
用法挺简单的,只需在Valine.min.js
文件的master
、friends
下填写需要添加【MD5加密后】的邮箱账号即可。
如下图,多个账号以数组形式添加即可。
效果如图
【附下载】: Valine.min.js
结束
至此,Valine评论系统已趋向于完美。
在此再次感谢的大佬的分享!!!
本文链接: https://senorui.top/posts/7bde.html
版权声明: 本站所有文章除特别声明外,均采用【CC BY-NC-ND 4.0】国际许可协议,若转载请注明出处!