给hexo添加评论系统

默认主题 landscape

文件目录，comments为新建的

_config.yml

layout -- _partial -- article.ejs

　　　    |- comments -- disqus.ejs

　　　　　　　　　　　　|- duoshuo.ejs

　　　　　　　　　　　　|- youyan.ejs

注册评论系统：

Disqus 注册设置Shortname

多说不用注册直接登录(例如用百度账号)，设置域名

友言注册，查看ID

1 修改主题配置文件 landscape/_config.yml 添加以下内容：

# >>> Conments 评论系统 <<<

# Chose ONE as your comment system and keep others disable.

# 选一个作为网站评论系统，其他保持禁用。

disqus:

  on: true

  shortname: yourshortname

  # https://help.disqus.com/customer/en/portal/articles/466208-what-s-a-shortname-

  # It is unnecessary to enable disqus here if

  # you have set "disqus_shortname" in your site's "_config.yml" 

duoshuo:

  #on: true

  domain: yourdomain

  # 是否开启多说评论，http://duoshuo.com/create-site/

  # 使用上面网址登陆你的多说，然后创建站点，在 domain 中填入你设定的域名

  # http://你的多说域名.duoshuo.com

youyan:

  #on: true

  id: yourID

  # 是否开启友言评论，http://www.uyan.cc/index.php

  # id 中填写你的友言用户数字ID，注册后进入后台管理即可查看

  # 友言服务在 Web 环境下运行，普通本地环境无法查看，请部署后在线上测试。

# >>> <<<

2 修改 article.ejs 添加：

<% if (!index && post.comments){ %>

    <% if (theme.duoshuo.on) { %>

      <%- partial('comments/duoshuo', {

          key: post.path,

          title: post.title,

          url: config.url+url_for(post.path),

          }) %>

    <% } else if (theme.youyan.on) { %>

        <%- partial('comments/youyan') %>

    <% } else if (theme.disqus.on) { %>

        <%- partial('comments/disqus', {

            shortname: theme.disqus.shortname

          }) %>

    <% } else if (config.disqus_shortname) { %>

        <%- partial('comments/disqus', {

            shortname: config.disqus_shortname

          }) %>

    <% } %>

<% } %>

3 在comments目录下新建3个文件：disqus.ejs、duoshuo.ejs、youyuan.ejs

# disqus.ejs

<section id="comments">

  <div id="disqus_thread"></div>

    <script type="text/javascript">

    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */

    var disqus_shortname = '<%= shortname%>'; // required: replace example with your forum shortname

    /* * * DON'T EDIT BELOW THIS LINE * * */

    (function() {

      var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;

      dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';

      (document.getElementsByTagName('head')[] || document.getElementsByTagName('body')[]).appendChild(dsq);

    })();

  </script>

  <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

</section>

# duoshuo.ejs

<div class="duoshuo" id="comments">

    <!-- 多说评论框 start -->

    <div class="ds-thread" data-thread-key="<%=key%>" data-title="<%=title%>" data-url="<%=url%>"></div>

    <!-- 多说评论框 end -->

    <!-- 多说公共JS代码 start (一个网页只需插入一次) -->

    <script type="text/javascript">

    var duoshuoQuery = {short_name:"<%=theme.duoshuo.domain%>"};

    (function() {

        var ds = document.createElement('script');

        ds.type = 'text/javascript';ds.async = true;

        ds.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//static.duoshuo.com/embed.js';

        ds.charset = 'UTF-8';

        (document.getElementsByTagName('head')[]

         || document.getElementsByTagName('body')[]).appendChild(ds);

    })();

    </script>

    <!-- 多说公共JS代码 end -->

</div>

# youyuan.ejs

<section class="youyan" id="comments">

  <div id="uyan_frame"></div>

  <script src="http://v2.uyan.cc/code/uyan.js?uid=<%= theme.youyan.id%>"></script>

</section>

配置完成，可以*选择使用一种评论系统了！效果如下：

给hexo添加评论系统

对于maupassant主题，已经自带了disqus、多说评论系统，只需要在maupassant/_config.yml中开启即可

秒客网

给hexo添加评论系统

相关文章