Skip to main content

IntenseDebate: Blogger.com 另一个博客评论插件

Blogger.com (by Pyra Labas)自带评论系统,让读者与作者交流的同时,也方便读者之间交流。没有博客日志评论功能,就少了人际互动可能。尼安德特人大约是人际互动比直立智人少得多,由此最后灭绝,所以我从不学习大牌博主那样关闭日志评论。可惜 Blogger 自带的 comment widget/xml 像太空旅行过程与地球总部的通联,在某些地方、某些时间时不时断联。因此为 Blogspot 加上备选评论系统一直放在我的待办清单里。

Blogger comments en Chine
该图片由OpenClipart-VectorsPixabay上发布

多番检索信息和评估后,在畅言社交评论等等选择里,我看中了 Intense Debate。它有这些优点:大厂产品(Automattic)、支持所有平台(Wordpress 与 Blogger 互为竞争关系,但是 Automattic 也支持 Blogger.com)、可显示最新评论。其中 Blogspot 首页或者日志页显示最新评论,能启动读者更多交流,这一功能最合我意。

那么,要想在 Blogger.com 加入 IntenseDebate 插件,大致要做以下四步骤。

一、注册帐号并且安装 IntenseDebate 评论插件

点击官网链接注册。英文不低于小学水平的话,注册过程、设置功能等,不会有太多麻烦。在 Blogger.com 加入 IntenseDebate 插件,除了备份好 Blogger XML template,还要把 IntenseDebate 自动处理后的模板再另行备份,为下一步优化 Blogger 页面样式准备。

Intensebase generated blogger.com template
上传 Blogger.com 模板文档,交给 IntenseDebate 自动加入评论插件

二、优化布局 Blogger Template 日志页面里 Intense Debate 的区域(DIV)

和其他站点一样, Blogspot(CSS:Division)横向、纵向多重套嵌区域,导致 Intense Debate 在 Blogger Template 自动加入评论区域(Division),但是与日志区域(post-body-container)可能不会对齐。结果日志区域(DIV)与页面左边距,和评论区域与页面左边距不一致,好像人龅牙一般吓退旁人。

为了解决页面 DIV 参差不齐,我把 Intense Debate 处理过的 comment xml 放到了

<div class='post-footer'>

后的第一层,也就是 <div class='post-footer'><!--Intense Debate-->lorem ipsum<!--/Intense Debate--></div>

这个 XML 管理的思路,是使用现代浏览器(顺便鄙视一下微软自己也淘汰的 IE)右键 inspect(检查) 功能,查看页面各种元素的命名、页面元素在页面组织里的位置关系、和页面元素的设定。

这样会不会更好理解我刚才示例的 intense debate comment code?我的评论区域,上一层区域是 post-footer,那我顺然得把 intense debate 页面自动加工过的 Blogger 模板 XML里面,那些和 comment 有关的代码,以区域(DIV)为一个最小单位放到 post-footer 闭合的区域里。

三、本地化 Intense Debate 设置

网页展开如果没有达到闪电样一般快的,可以关闭掉 embeded video 功能。方法:登入 Intense Debate 网页帐号后,到 https://intensedebate.com/plugins/429731 看到 YouTube Embeddable Video 有 deactivate 按钮的,按一下 deactivate。

另外,默认安装的 Intense Debate,在评论框下缘加了横幅 banner,显示 powered by IntenseDebate,重复了评论登入界面的横幅。这里可以找到这个横幅的元素名称,在 CSS 里通过 display:none 隐藏。

四、Intense Debate 和 Blogger 评论并存

WFUBlog 提供了解决思路,用两个 Tabs 分别列入 Google Blogger Comments 和 Intense Debate Comments,具体可以看他的日志按葫芦画瓢操作。

如果有疑问,欢迎留言。如果觉得喜欢和有用,欢迎转发。