Hexo添加Valine评论功能

发表于 分类于 Valine： 本文字数： 2.1k

前言

一直想给自己的博客添加评论功能，比较靠谱的评论系统有GitHub上的gitment，gitalk，gitter，来必力(有点儿花哨)，以及一些国外的评论系统(需要翻墙)。偶然间了解到一款国人开发的评论系统叫Valine用的是LeanCloud作为数据库，洁面很简洁，不像来必力那样花哨只是单纯的评论，简洁到没有后台，删除和管理评论直接操作数据库，于是决定就是你了。本片博客用于记录添加Valine评论功能的完整过程。

添加Valine评论

  1. 注册LeanCloud

  2. 创建一个开发版应用

  3. 创建 Class
    在LeanCloud -> 存储 -> 创建Class -> 无限制的Class

  4. 关闭服务开关
    在LeanCloud -> 设置 -> 安全中心 -> 服务开关，把除数据存储其他选项都关闭。
  5. 添加域名
    在LeanCloud -> 设置 -> 安全中心 -> Wwb安全域名，注意格式

  6. 修改主题配置文件
    打开主题配置文件_config.yml，搜索找到Valine部分，填写appid以及appkey

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    # Valine
    # You can get your appid and appkey from https://leancloud.cn
    # For more information: https://valine.js.org, https://github.com/xCss/Valine
    valine:
    enable: true # When enable is set to be true, leancloud_visitors is recommended to be closed for the re-initialization problem within different leancloud adk version
    appid: # your appid
    appkey: # your appkey
    notify: true # Mail notifier. See: https://github.com/xCss/Valine/wiki
    verify: false # Verification code
    placeholder: Just go go # 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: false # leancloud-counter-security is not supported for now. When visitor is set to be true, appid and appkey are recommended to be the same as leancloud_visitors' for counter compatibility. Article reading statistic https://valine.js.org/visitor.html
    comment_count: true # If false, comment count will only be displayed in post page, not in home page

  7. 开启email通知
    若要开启邮件通知，首先修改主题配置文件：

    1
    notify: true # Mail notifier. See: https://github.com/xCss/Valine/wiki

    然后在LeanCloud -> 设置 -> 邮件模板
    用于重置密码的邮件主题修改为：

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

    内容修改为：

    1
    2
    3
    4
    5
    <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>

  8. 最后欢迎大家在下方评论区测试评论

0%