Valine评论添加[博主,小伙伴,访客]标签

参考内容:HCLonely:Valine 添加验证码、博主标签及评论微信、QQ 通知
改动范围:极简化了赋值过程,避免因开启pjax后,在切换页面时反复声明变量导致的bug。

修改步骤

  1. 打开[Blogroot]\themes\butterfly\layout\includes\third-party\comments\valine.pug,按指示添加如下字段。

          serverURLs: '#{theme.valine.serverURLs}',
    emojiCDN: '#{theme.valine.emojiCDN}',
    emojiMaps: !{emojiMaps},
    enableQQ: #{theme.valine.enableQQ},
    path: window.location.pathname,
    + master: '#{theme.valine.master}'.split(','),
    + friends: '#{theme.valine.friends}'.split(','),
    + tagMeta: '#{theme.valine.tagMeta || "博主,小伙伴,访客"}'.split(',')
    }
  2. 打开[Blogroot]\_config.butterfly.yml,

    • valine配置项添加如下内容。
      md5加密可以使用在线转码,务必使用32位[小]进行转码。

          # valine
      # https://valine.js.org
      valine:
      appId: # leancloud application app id
      appKey: # leancloud application app key
      pageSize: 10 # comment list page size
      avatar: monsterid # gravatar style https://valine.js.org/#/avatar
      lang: zh-CN # i18n: zh-CN/zh-TW/en/ja
      placeholder: # valine comment input placeholder (like: Please leave your footprints)
      guest_info: nick,mail,link # valine comment header info (nick/mail/link)
      recordIP: false # Record reviewer IP
      serverURLs: https://???????.api.lncldglobal.com # This configuration is suitable for domestic custom domain name users, overseas version will be automatically detected (no need to manually fill in)
      bg: # valine background
      emojiCDN: # emoji CDN
      enableQQ: true # enable the Nickname box to automatically get QQ Nickname and QQ Avatar
      requiredFields: nick,mail # required fields (nick/mail)
      + master: # md5加密后的博主邮箱
      + - d4e7????4d361ad7????44a14e9e2a94 #可添加多个
      + friends: # md5加密后的小伙伴邮箱
      + - 5c?????bfe6rfc72a????e268ad3819c #可添加多个
      + - 7c?????bfe65fc02a????e2????3919c
      + tagMeta: '博主,小伙伴,访客' # 标签要显示的文字,默认'博主,小伙伴,访客'
    • CDN配置项添加如下内容。将Valine.min.js替换成HCLonely魔改的版本

          CDN:
      # main
      main_css: /css/index.css
      jquery: https://cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js
      main: /js/main.js
      utils: /js/utils.js
      # pjax
      pjax: https://cdn.jsdelivr.net/npm/pjax/pjax.min.js
      # comments
      gitalk: https://cdn.jsdelivr.net/npm/gitalk@latest/dist/gitalk.min.js
      gitalk_css: https://cdn.jsdelivr.net/npm/gitalk/dist/gitalk.min.css
      - valine: https://cdn.jsdelivr.net/npm/valine/dist/Valine.min.js
      + valine: https://cdn.jsdelivr.net/gh/HCLonely/Valine@latest/dist/Valine.min.js
  3. 以上步骤完成后,已经可以看到实现效果了。更多内容还请自行下载Valine.min.js源码进行修改。