怎样为你的博客增加评论功能

  1. 博客微调
    1. 页面修改
    2. 脚本修改

看了那么多网上使用多说失败的帖子, 所以决定直接使用disqus作为我的博客系统

博客微调

这个评论系统做的真的非常棒, 暂时还不了解它的工作原理, 不明白它怎么区分不同的文章的, 不管怎样,先布上去再说.

页面修改

我的博客比较简单, 因为我只想给每个post页面, 所以在post页面中多一个include文件disqus, 内容如下:

1
2
3
4
5
<!-- An element a visitor can click if they <3 comments! -->
<div id="disqus_thread" name="{{ site.disqus.shortname }}">
<noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink" target="_blank">Loading Disqus comments...</a>
</div>

这样每个页面在加完后都会多个div来表示需要拉取谁的评论信息, 我这里使用的jekyll博客, 所以这里的配置其实是来自_config.yml:

1
2
3
4
5
6
# ...

disqus:
shortname: aiziyuer

# ...

脚本修改

我这里使用的ajax的方式执行js, 详细如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var ds_loaded = false;
var top = $('#disqus_thread').offset().top;
window.disqus_shortname = $('#disqus_thread').attr('name');

function check() {
if ( !ds_loaded && container.scrollTop() + container.height() > top ) {
$.ajax({
type: 'GET',
url: '//' + disqus_shortname + '.disqus.com/embed.js',
dataType: 'script',
cache: true
});
ds_loaded = true;
}
}check();
container.scroll(check);

转载请注明来源,欢迎对文章中的引用来源进行考证,欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论,也可以邮件至 jaytp@qq.com

💰

×

Help us with donation