Octorpess添加评论功能

使用的是多说评论系统

注册多说http://duoshuo.com/

0x00 系统设置修改

在_config.xml文件最下方添加 yurename为注册多说时的个性域名二级域名,例如mzkmzk.duoshuo.com yourname则为mzkmzk

# duoshuo comments
duoshuo_comments: true
duoshuo_short_name: yourname

0x01 修改页面

在 source/_layouts/post.html 最下方添加的 disqus代码

\{\% if site.duoshuo_short_name and site.duoshuo_comments == true and page.comments == true \%\}
<section>
<h1>Comments</h1>
<div id="comments" aria-live="polite">\{\% include post/duoshuo.html \%\}</div>
 </section>
 \{\% endif \%\}

如果你希望一些单独的页面下方也放置评论功能，譬如 rake new_page["xxx"] 产生的页面也能评论，那么请在 source/_layouts/page.html 中也做如上的修改。

0x02 创建模块代码

创建文件source/_includes/post/duoshuo.html

代码如下

<!-- 多说评论框 start -->
<div class="ds-thread" data-thread-key="\{\% if site.titlecase \%\}\{\{ page.title | titlecase \}\}\{\% else \%\}\{\{ page.title \}\}\{\% endif \%\}" data-title="\{\% if site.titlecase \%\}\{\{ page.title | titlecase \}\}\{\% else \%\}\{\{ page.title \}\}\{\% endif \%\}" data-url="\{\% if site.url \%\}\{\{ page.url | url \}\}\{\% else \%\}\{\{ page.url \}\}\{\% endif \%\}"></div>
<!-- 多说评论框 end -->
<!-- 多说公共JS代码 start (一个网页只需插入一次) -->
<script type="text/javascript">
var duoshuoQuery = {short_name:"mzkmzk"};
(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 -->

0x03 在文章标签处添加评论快捷键

就是在文章左侧添加一个按钮 点一下即可到评论模块

文件_includes/article.html

        \{\% if site.disqus_short_name and page.comments != false and post.comments != false and site.disqus_show_comment_count == true \%\}
     | <a href="\{\% if index \%\}\{\{ root_url \}\}\{\{ post.url \}\}\{\% endif \%\}#disqus_thread">Comments</a>
    \{\% endif \%\}

下方添加

   \{\% if site.duoshuo_short_name and page.comments != false and post.comments != false and site.duoshuo_comments == true \%\}
      | <a href="\{\% if index \%\}\{\{ root_url \}\}\{\{ post.url \}\}\{\% endif \%\}#comments">Comments</a>
     \{\% endif \%\}

参考链接

http://havee.me/internet/2013-02/add-duoshuo-commemt-system-into-octopress.html

octopress

Comments