前提

如果尚未安装多说评论框，请百度，关于评论框安装的教程在其他hexo相关的文章中是比较多的。

如果已经为hexo添加了多说评论框并且可以正常使用，即已经添加了下面这段代码，那么可以继续了，因为多说最近访客和最近评论和评论框一样是依赖于下面这段通用代码的。

<!--多说js加载开始，一个页面只需要加载一次 -->
<script type="text/javascript">
var duoshuoQuery = {short_name:"您的多说二级域名"};
(function() {
var ds = document.createElement('script');
ds.type = 'text/javascript';ds.async = true;
ds.src = 'http://static.duoshuo.com/embed.js';
ds.charset = 'UTF-8';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ds);
})();
</script>
<!--多说js加载结束，一个页面只需要加载一次 -->

注：最终我把这段多说通用代码添加到了hexo主题文件夹下的layout/_partial/footer.ejs文件中，这个文件中的代码不仅会在article页面生效，而且在hexo首页也会生效。这样就确保位于首页的最近访客widget和最近评论widget可以正常使用。
最初我添加了最近访客和最近评论后发现首页不生效，只在打开article页面才会生效。原因就是上面那段多说的通用代码放在了某个在首页不加载的文件中了。

添加最近访客widget

在主题文件夹下的layout/_widget文件夹内新建ejs文件，如recent_visitors.ejs。代码如下

<% if (site.posts.length){ %>
<div class="widget-wrap">
<h3 class="widget-title">最近访客</h3>
<div class="widget">
<ul class="ds-recent-visitors" data-num-items="12"></ul>
</div>
</div>
<% } %>

添加最近评论widget

类似于最近访客，同样地目录建立recent_comment.ejs，代码：

<% if (site.posts.length){ %>
<div class="widget-wrap">
<h3 class="widget-title">最新评论</h3>
<div class="widget">
<div class="ds-recent-comments" data-num-items="10" data-show-avatars="1" data-show-time="1" data-show-title="1" data-show-admin="1" data-excerpt-length="70"></div>
</div>
</div>
<% } %>

启用widget

主题文件夹下的_config.yml文件中在widget段落仿照已有格式添加，注意格式保持一致，尤其是缩进。

- recent_visitors
- recent_comments

参数

在两个widget的代码中有类似data-num-items、data-num-items、data-show-avatars等参数，但是有些在我这里测试是无效的,可能跟hexo某个特定主题的架构有关。

比如pacman这个主题，想要修改头像的大小，需要在主题目录里的source/css/_partial/duoshuo.styl里修改css，具体参数的修改就需要各位自己探索测试了。

文章目录