2006-09-22

3分钟搞定Blogger页内评论

似乎有不少人对添加页内评论功能很感兴趣,的确,有了页内评论,方便访客留言,增加了与大家的互动。

8O也在网上找了很多不同的添加页内评论的方法,还是没有发现一套完美的解决方案,不是实现起来太复杂(not 菜瓜 friendly),就是功能“太强”,而且不稳定(需要调用其他网站上的js)。

8过功夫不负有心人,搜了这么长时间还是有收获D。按照Browervulsel上的方法,你可以很方便的在blogger上建立自己的页内评论功能。当然任何收获都是有代价D,你接受以下的“牺牲”:

将“谁能发表评论?”设置为“任何人”
关闭“留言显示验证词”
无法启用评论审阅功能

好在访问8O的blogger的朋友们素质都很高,而且流动人口又少(伤心啊555~~~),所以8O认为可以放心大胆的放开评论(言论自由嘛),如果你也想鼓励大家在你的blogger上留言,那么o们就看看怎么在3分钟内搞定页内评论

第一分钟:
老规矩,备份原模版。
既然要放开评论,就彻底的放开。


第二分钟:
复制以下代码,粘贴到</BlogItemComments>后(sorry,写得太匆忙)

<form id="cFrm" action="http://www.blogger.com/login-comment.do" method="post">
<script type="text/javascript">
//<![CDATA[
var expires = new Date();
expires.setFullYear(expires.getFullYear()+1);
function setCookie(name, value) {
document.cookie = name +'='+ escape(value) +'; expires='+ expires.toGMTString();
}
function getCookie(name) {
var key = name + '=';
var c = document.cookie;
var i = c.indexOf(key);
if (i < 0) return '';
var j = c.indexOf(';', i + key.length);
if (j < 0) j = c.length;
return unescape(c.substring(i + key.length, j));
}
function trim(text) {
return text.replace(/^\s+|\s+$/g, '');
}
var bgPosted = false;
function cFrmPost() {
with (cFrm) {
anonName.value = trim(anonName.value);
anonURL.value = trim(anonURL.value);
postBody.value = trim(postBody.value);
if (anonName.value == '') {
alert('Please enter your name');
anonName.focus();
return false;
}
if (postBody.value == '') {
alert('Please enter a comment');
postBody.focus();
return false;
}
anonURL.value = anonURL.value.replace(/^http:\/\//g, '');
}
bgPosted = true;
return true;
}
function bgpostLoad() {
if (bgPosted == true) {
if (cFrm.remember.checked) {
setCookie('anonName', cFrm.anonName.value);
setCookie('anonURL', cFrm.anonURL.value);
}
window.location.reload();
}
}
//]]>
</script>
<iframe style="position:absolute;left:-9999px;top:0" name="bgpost" onload="bgpostLoad()"></iframe>
<div>
<input type="hidden" name="blogID" value="<$BlogID$>" />
<input type="hidden" name="postID" value="<$BlogItemNumber$>" />
<input type="hidden" name="isPopup" value="false" />
<input type="hidden" name="iden" value="Other" />
</div>
<dl>
<dt><label for="uname">Name</label></dt>
<dd><input type="text" id="uname" name="anonName" maxlength="100" /></dd>
<dt><label for="url">Homepage</label></dt>
<dd><input type="text" id="url" name="anonURL" maxlength="100" /></dd>
<!-- START SPAM PROTECT remove comment to enable
<dt><label for="captcha">Word verification</label></dt>
<dd>
<img src="http://www.blogger.com/captcha?postID=<$BlogItemNumber$>" height="70" width="200" alt="Verification image" />
<br /><input type="text" id="captcha" name="captcha" /><br />
This is <a href="http://help.blogger.com/bin/answer.py?answer=1203">spam protection</a>.
Please enter the text in the image above to leave your comment.
</dd>
END SPAM PROTECT remove comment to enable -->
<dt><label for="comment-body">Comment</label></dt>
<dd><textarea id="comment-body" name="postBody" cols="60" rows="10"></textarea>
<script type="text/javascript">
//<![CDATA[
var cFrm = document.getElementById('cFrm');
cFrm.target = 'bgpost';
cFrm.onsubmit = function(){return cFrmPost()};
if (document.cookie != '') {
cFrm.anonName.value = getCookie('anonName');
cFrm.anonURL.value = getCookie('anonURL');
}
cFrm.postBody.value = '';
if (cFrm.captcha) cFrm.captcha.value = '';
document.write(
'</dd><dd><input type="checkbox" id="remember">'+
' <label for="remember">Remember me</label>'
);
//]]>
</script>
</dd>
</dl>
<p><input type="submit" name="post" value="Post" /></p>
</form>


第三分钟:
基本上你已经大功告成,你还需要将下面的代码

<a class="comment-link"href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>>
<$BlogItemCommentCount$> comments</a>


替换成

<a href="<$BlogItemPermalinkUrl$>#comments">Comments (<$BlogItemCommentCount$>)</a>

如果彻底不想让用户打开blogger默认的评论页面,你还需要删除(或屏蔽)

<p class="comment-timestamp">
<$BlogItemCreate$>
</p>


测试一下效果吧!有问题可以在这里提,如果只是想测试,请访问页内评论测试页


更新1:此贴出现大量Spam评论暂时关闭评论功能,如有问题或建议可使用留言板!!!


更新2:blogger更新,此hacks已无法应用

HOW TO: 怎样生成自己的标签云

搜索此博客