在WordPress中利用Jquery隐藏较旧留言

最近对blog的主题再更改了一下，检查时候觉得当某页面的留言多了，查看起来不太方便，而且页面也会被弄得过长呢，自己不太喜欢。那就想干脆把旧的留言收起来，或者做成留言分页好了。

对于即将到来的WordPress 2.7，我们可以通过修改模板实现留言分布，具体教程可以看这篇《WordPress 2.7 的评论分页》。但当我看到Sofish介绍的这篇《写给设计人的10个jQuery特效》后，我决定还是用伟大的JQuery隐藏旧留言吧，需要查看效果的请直接到本站查看留言吧，因为贴个图看不出

实现不难，首先在<header>标签内调用JQuery，我是直接拿来主义的：http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js，你直接链接这个地址就好了，好处不用多说。

然后在<header>标签内再增加一段javascript：

$(document).ready(function(){ //只展开第一条留言，数字0代表。 $(".message_list .message_body:gt(0)").hide(); //隐藏第5条后的所有留言，数字4代表。 $(".message_list li:gt(4)").hide(); //隐藏和展开留言效果 $(".message_head").click(function(){ $(this).next(".message_body").slideToggle(500) return false; }); //收起所有留言 $(".collpase_all_message").click(function(){ $(".message_body").slideUp(500) return false; }); //显示所有留言 $(".show_all_message").click(function(){ $(this).hide() $(".show_recent_only").show() $(".message_list li:gt(4)").slideDown() return false; }); //显示最近留言（留言条数可通过上面设置） $(".show_recent_only").click(function(){ $(this).hide() $(".show_all_message").show() $(".message_list li:gt(4)").slideUp() return false; }); });

然后就是打开你的comment.php文件，修改一下留言的<ol><li>标签的样式定义，当然你也可以修改上面js语句中的样式定义使其符合你原来的comment样式。这里我以修改comment.php文件中的样式作例：

把模板中的<ol>样式改为message_list，即成为<ol class="message_list">；
在<li>标签内，增加一段用于隐藏留言内容后的显示标题，比如显示留言者的名字，留言时间等：
<p class="message_head"><cite>留言者名字</cite> <span class="timestamp">留言时间</span></p>
注意这里的样式是"message_head"。一般添加在留言内容之前则可。
然后把留言的内容（即要可隐藏的内容）用一个<div class="message_body">包括起来，在WordPress中代码可以如下：
<div class="message_body"><?php echo comment_text();?></div>。
接着在comment.php内查找</ol>这个结束标签，在其后面加上如下代码：
<p class="collapse_buttons"><a href="#" class="show_all_message">Show all comments (<?php echo $countComments; ?>)</a> <a href="#" class="show_recent_only">Show 5 only</a> <a href="#" class="collpase_all_message">Collapse all</a></p>
增加这段是为了增加“显示/隐藏”留言的链接按钮。