博客搭建历程(4)


博客评论系统的选择

其他评论系统参考

经过一波折腾,最终选择了Valine
我喜欢它的匿名评论,23333!!!

参考教程 作者的博客 Valine文档

安装过程简记

  • 注册Leancloud
  • 创建应用
  • 获取appid和appkey
  • 设置安全域名

部署云引擎 参考

设置好环境变量

yilia主题修改

1、修改themes\yilia\_config.yml

https://github.com/litten/hexo-theme-yilia/pull/646

#6、Valine https://valine.js.org
valine:
  enable: true
  appid:    #LeanCloud的appId
  appkey:   #Leancloud的appKey
  verify: false #验证码
  notifi: false #评论回复提醒
  avatar: ' '#评论列表头像样式
  placeholder: Just go go #评论占位框
  pageSize: 15    #评论分页

2、修改themes\yilia\layout\_partial\article.ejs

我是在尾部位添加的

<% if (theme.valine && theme.valine.appid && theme.valine.appkey){ %>
    <section id="comments" style="margin:10px;padding:10px;background:#fff;">
      <%- partial('post/valine', {
        key: post.slug,
        title: post.title,
        url: config.url+url_for(post.path)
        }) %>
    </section>
  <% } %>

themes\yilia\layout\_partial\post下新建个·valine.ejs·文件

添加如下代码

<div id="vcomment" class="comment"></div> 
<script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
<script src="//unpkg.com/valine/dist/Valine.min.js"></script>
<script>
   var notify = '<%= theme.valine.notify %>' == true ? true : false;
   var verify = '<%= theme.valine.verify %>' == true ? true : false;
    window.onload = function() {
        new Valine({
            el: '#vcomment',
            notify: notify,
            verify: verify,
            app_id: "<%= theme.valine.appid %>",
            app_key: "<%= theme.valine.appkey %>",
            placeholder: "<%= theme.valine.placeholder %>",
            avatar:"<%= theme.valine.avatar %>"
        });
    }
</script>

测试下效果

hexo g
hexo s

预览

没问题就部署到github吧
hexo d -g

定时器添加

https://github.com/zhaojun1998/Valine-Admin/issues/1


文章作者: ShanSan
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 ShanSan !
 上一篇
优雅的Markdown 优雅的Markdown
Markdown浅尝一、勾选框注意[]前后都要有空格 - [x] 干的漂亮 - [x] 吃饭 - [x] 写代码 - [ ] 睡觉 干的漂亮 吃饭 写代码 睡觉 二、列表#无序列列表 * 换成 - 也行 * 你 * 你好 *
2018-09-28 ShanSan
下一篇 
Markdown(2) Markdown(2)
兴奋于搭建了我的博客,兴奋于认识了markdown,终于可以甩开花里胡哨的word了,233333!!! 认识Markdown Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格
2018-09-26
  目录