Next -6- 添加Valine评论系统

Next V7.7.1 自带很多评论系统，其中Valine诞生于2017年8月7日，是一款基于Leancloud的快速、简洁且高效的无后端评论系统。Valine具有添加方便，轻量，运行、加载速度快，不需要用户登录等优点。

本文介绍Next中添加Valine评论系统的方法。

依赖leancloud

• 申请leancloud账号，官网链接。
• 登录leancloud，进入控制台点击创建应用。

• 填写应用名称，选择开发版

• 创建成功后点击应用右上角的齿轮进入应用设置

• 设置选项卡中选择应用 Keys，右边AppID和AppKey就是我们需要的标识和密钥。

本地设置

在Next主题配置文件中修改valine字段内的值，将enable设置为true，将刚刚得到的AppID和AppKey填入相应字段中。

# Valine
# For more information: https://valine.js.org, https://github.com/xCss/Valine
valine:
  enable: true
  appid: XXXXXXXXXXX< your AppID>XXXXXXXXXXXX # Your leancloud application appid
  appkey: XXXXXX<your AppKey>XXXXXXX # Your leancloud application appkey
  notify: true # Mail notifier
  verify: true # Verification code
  placeholder: 遗憾莫过于难忘你的背影，却找不到你来过的痕迹 ... # Comment box placeholder
  avatar: mm # Gravatar style
  guest_info: nick,mail,link # Custom comment header
  pageSize: 10 # Pagination size
  language: # Language, available values: en, zh-cn
  visitor: true # Article reading statistic
  comment_count: true # If false, comment count will only be displayed in post page, not in home page
  recordIP: false # Whether to record the commenter IP
  serverURLs: # When the custom domain name is enabled, fill it in here (it will be detected automatically by default, no need to fill in)
  #post_meta_order: 0

修改enable和AppID、AppKey之后：

• notify：评论后的邮件提示，还需要在leancloud中设置邮件模板自动回复

你在{{appname}} 的评论收到了新的回复

<p>Hi, {{username}}</p>
<p>
你在 {{appname}} 的评论收到了新的回复，请点击查看：
</p>
<p><a href="你的网址首页链接" style="display: inline-block; padding: 10px 20px; border-radius: 4px; background-color: #3090e4; color: #fff; text-decoration: none;">马上查看</a></p>

• verify：评论时需要验证码
• placeholder：占位符，就是在没有评论时默认的提示文字
• visitor：标题和首页显示浏览量(与不蒜子的会重复，可以选择一个保留)

说明

Next V7.7.1 已经集成了相关程序包，不需要额外安装，只要填入AppID和AppKey就好，否则容易出现各种奇怪的问题（别问我怎么知道的）

数据安全

可选操作：在【Leancloud】 -> 【设置】 -> 【安全中心】 -> 【Web 安全域名】把你的域名加进去，可防止数据被篡改。

标题Valine字段翻译

这个字段生成过程和其他不一样，定义的变量在post下的comments下的valine，修改zh-Hans.yml

post:
  comments:
    valine: 评论次数 

源码踪迹

相关的Valine评论数生成的源文件是themes -> next -> scripts -> filters -> comment -> valine.js

该函数在同文件夹下的common.js文件内

因此在zh-Hans.yml中定义post.comments.valine 变量的翻译字段

文章链接：
https://www.zywvvd.com/notes/hexo/theme/next/6-add-valine-comments/add-valine-comments/