Hexo

Hexo添加评论功能

前面，我们的个人博客已经配置好了，但是还不能评论，这篇文章就主要说说Hexo如何添加评论功能

评论功能我们用的是多说评论系统,其实配置很简单，多说官网上已经讲得很清楚了，下面就简单说下步骤。

Step1

在站点的_config.yml中添加多说的配置：

1
duoshuo_shortname: 你站点的short_name

修改themes\landscape\layout_partial\article.ejs模板
把

1
2
3
4
5
6
7
<% if (!index && post.comments && config.disqus_shortname){ %>
 <section id="comments">
   <div id="disqus_thread">
     <noscript>Please enable JavaScript to view the <a href="//disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
   </div>
 </section>
 <% } %>

改为

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<% if (!index && post.comments && config.duoshuo_shortname){ %>
 <section id="comments">
   <!-- 多说评论框 start -->
   <div class="ds-thread" data-thread-key="<%= post.layout %>-<%= post.slug %>" data-title="<%= post.title %>" data-url="<%= page.permalink %>"></div>
   <!-- 多说评论框 end -->
   <!-- 多说公共JS代码 start (一个网页只需插入一次) -->
   <script type="text/javascript">
   var duoshuoQuery = {short_name:'<%= config.duoshuo_shortname %>'};
     (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')[0] 
        || document.getElementsByTagName('body')[0]).appendChild(ds);
     })();
     </script>
   <!-- 多说公共JS代码 end -->
 </section>
 <% } %>

step2

打开文章的评论功能，默认情况下，我们写的文章是没有评论功能的，如果需要打开，需要在文章前面加上是comments: true,如下：

1
2
3
4
5
6
7
8
9
---
title: Hexo更改LandScape主题样式
date: 2017/1/18 17:42:45
categories: Hexo
tags: 
- Hexo主题
- Landscape
comments: true
---

step3

注册duoshuo账户

打开多说官网,选择我要安装，选择第三方登入方式，然后填写相关信息，如下图

多说1.png

经过以上配置，我们的博客就有评论功能了。