只在WP主评论加上楼层号的方法『支持顺序、倒序』

2015.12.18 !!!:无意中在修改主题发现,此文章方法在 WordPress 4.4 出现错乱,我找个时间修正下。

----

今天在修改付费主题 zSnos2.5 时顺便把此主题的“主评论显示楼层号”代码优化了一下,让它支持评论顺序和倒序

基础代码可以参考我以前写的 2 篇文章:《只在WP主评论加上楼层号的方法(支持评论分页)》,《倒序显示主评论楼层号(支持评论分页)

很久没折腾这些了,当作是重新整理吧,以前都是折腾到什么就写什么,木有对相同功能的代码进行整合和优化,今天就先拿这个整合一下(还是折腾到啥写啥,囧)

前提条件:

1. 需要开启嵌套评论和评论分页功能(WP后台 》设置 》讨论)
2. 主题评论调用函数 wp_list_comments() (在 comments.php 文件里)使用了回调函数。具体参考:http://codex.wordpress.org/Template_Tags/wp_list_comments
3. 此文章所说主题评论是调用所有类型评论:comment、pingback、trackback,如果只是调用 comment 部分,需要对代码稍微修改

下面以官方给出的 wp_list_comments() 回调函数作为例子来说明。

1. 官方最新的 wp_list_comments() 回调函数代码:(这段代码一般放在主题文件 functions.php)

function mytheme_comment($comment, $args, $depth) {
	$GLOBALS['comment'] = $comment;
	extract($args, EXTR_SKIP);

	if ( 'div' == $args['style'] ) {
		$tag = 'div';
		$add_below = 'comment';
	} else {
		$tag = 'li';
		$add_below = 'div-comment';
	}
?>
	<<?php echo $tag ?> <?php comment_class(empty( $args['has_children'] ) ? '' : 'parent') ?> id="comment-<?php comment_ID() ?>">
	<?php if ( 'div' != $args['style'] ) : ?>
	<div id="div-comment-<?php comment_ID() ?>" class="comment-body">
	<?php endif; ?>
	<div class="comment-author vcard">
	<?php if ($args['avatar_size'] != 0) echo get_avatar( $comment, $args['avatar_size'] ); ?>
	<?php printf(__('<cite class="fn">%s</cite> <span class="says">says:</span>'), get_comment_author_link()) ?>
	</div>
<?php if ($comment->comment_approved == '0') : ?>
	<em class="comment-awaiting-moderation"><?php _e('Your comment is awaiting moderation.') ?></em>
	<br />
<?php endif; ?>

	<div class="comment-meta commentmetadata"><a href="<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>">
		<?php
			/* translators: 1: date, 2: time */
			printf( __('%1$s at %2$s'), get_comment_date(),  get_comment_time()) ?></a><?php edit_comment_link(__('(Edit)'),'  ','' );
		?>
	</div>

	<?php comment_text() ?>

	<div class="reply">
	<?php comment_reply_link(array_merge( $args, array('add_below' => $add_below, 'depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
	</div>
	<?php if ( 'div' != $args['style'] ) : ?>
	</div>
	<?php endif; ?>
<?php
	}

2. 然后在 $GLOBALS['comment'] = $comment; 这句下面添加楼层号处理函数,具体看下面修改好的的代码(蓝色部分

2015.07.12 补充:有朋友说 WordPress 4.x 倒序方式时获取的总评论数失效,已改为 #42  楼的方法解决
2016.04.21 修正:忘了是 WordPress 4.x 了,$in_comment_loop 无法获取正确的值,已改为 get_query_var('cpage') 来判断(感谢 #44 楼的朋友指出)。

<?php
function mytheme_comment($comment, $args, $depth) {
	$GLOBALS['comment'] = $comment;

	 //主评论计数器 by zwwooooo
	global $commentcount, $page, $wpdb;
	if ( (int) get_option('page_comments') === 1 && (int) get_option('thread_comments') === 1 ) { //开启嵌套评论和分页才启用
		if(!$commentcount) { //初始化楼层计数器
			$page = ( get_query_var('cpage') ) ? get_query_var('cpage') : get_page_of_comment( $comment->comment_ID, $args ); //获取当前评论列表页码
			$cpp = get_option('comments_per_page'); //获取每页评论显示数量
			if ( get_option('comment_order') === 'desc' ) { //倒序
				$cnt = get_comments('post_id='.$post->ID.'&status=approve&count=true'); //获取主评论总数量
				if (ceil($cnt / $cpp) == 1 || ($page > 1 && $page  == ceil($cnt / $cpp))) { //如果评论只有1页或者是最后一页,初始值为主评论总数
					$commentcount = $cnt + 1;
				} else {
					$commentcount = $cpp * $page + 1;
				}
			} else {
				$commentcount = $cpp * ($page - 1);
			}
		}
		if ( !$parent_id = $comment->comment_parent ) {
			$commentcountText = '<div class="floor">';
			if ( get_option('comment_order') === 'desc' ) { //倒序
				$commentcountText .= --$commentcount . '楼';
			} else {
				switch ($commentcount) {
					case 0:
						$commentcountText .= '<span>沙发!</span>'; ++$commentcount;
						break;
					case 1:
						$commentcountText .= '<span>板凳!</span>'; ++$commentcount;
						break;
					case 2:
						$commentcountText .= '<span>地板!</span>'; ++$commentcount;
						break;
					default:
						$commentcountText .= ++$commentcount . '楼';
						break;
				}
			}
			$commentcountText .= '</div">';
		}
	}

	extract($args, EXTR_SKIP);

	if ( 'div' == $args['style'] ) {
		$tag = 'div';
		$add_below = 'comment';
	} else {
		$tag = 'li';
		$add_below = 'div-comment';
	}
?>
	<<?php echo $tag ?> <?php comment_class(empty( $args['has_children'] ) ? '' : 'parent') ?> id="comment-<?php comment_ID() ?>">
	<?php if ( 'div' != $args['style'] ) : ?>
	<div id="div-comment-<?php comment_ID() ?>" class="comment-body">
	<?php endif; ?>
	<div class="comment-author vcard">
	<?php if ($args['avatar_size'] != 0) echo get_avatar( $comment, $args['avatar_size'] ); ?>
	<?php printf(__('<cite class="fn">%s</cite> <span class="says">says:</span>'), get_comment_author_link()) ?>
	</div>
<?php if ($comment->comment_approved == '0') : ?>
	<em class="comment-awaiting-moderation"><?php _e('Your comment is awaiting moderation.') ?></em>
	<br />
<?php endif; ?>

	<div class="comment-meta commentmetadata"><a href="<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>">
		<?php
			/* translators: 1: date, 2: time */
			printf( __('%1$s at %2$s'), get_comment_date(),  get_comment_time()) ?></a><?php edit_comment_link(__('(Edit)'),'  ','' );
		?>
	</div>

	<?php comment_text() ?>

	<div class="reply">
	<?php comment_reply_link(array_merge( $args, array('add_below' => $add_below, 'depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
	</div>

	<?php echo $commentcountText; //主评论楼层号 - by zwwooooo ?>

	<?php if ( 'div' != $args['style'] ) : ?>
	</div>
	<?php endif; ?>
<?php
	}

注:(底部显示位置可以自己根据自己所用主题选择,这里我加在回复按钮后面,另外楼层显示样式可以通过 floor 这个 class 定义)

就这样吧,现在折腾 WordPress 的朋友少了很多,新朋友参考一下吧。

zww
or
oooo

“只在WP主评论加上楼层号的方法『支持顺序、倒序』”有117条评论

  1. 夜光 says:

    评论贴代码试试

    <?php
    echo "Hello";
    ?>

  2. 夜光 says:

    再试试 :wink:

    <?php
    echo "Hello";
    ?>

    1. zwwooooo says:

      @夜光
      这……你在测试评论的“贴代码”么?

  3. 夜光 says:

    你的评论贴代码,格式化pre标签包裹的代码,是在提交评论时格式化的preprocess_comment?管理员评论时贴的代码与普通访客贴代码时采取的措施一样吗?还是管理员只需要在显示时格式化comment_text? :arrow: 不好表达,不知道看懂木有

    1. zwwooooo says:

      @夜光
      提交前先处理。(用的是js方法)

    2. 3.1415926 says:

      @zwwooooo 接昨天的说,最近鼓捣ajax评论翻页焦头烂额,网上找了好多代码就是搞不定,不开ajax翻页正常,一开就会楼层出错。目前楼层计数用的是你这里的,请指点下评论分页的代码..

    3. 3.1415926 says:

      @zwwooooo 另外看到昨天提的bug也修复了..

    4. zwwooooo says:

      @3.1415926 不清楚你的 ajax 是如何写的(有好几种写法),不管那种都要记得把 cpage 值传递过去,如我的翻页 http://zww.me/archives/25716/comment-page-2?action=AjaxCommentsPage&post=25716&page=1&callback=mytheme_comment#comments 里面已经把需要的参数都传递给后台的 AjaxCommentsPage 函数

    5. zwwooooo says:

      @3.1415926 你提到的问题其实 #44 楼的朋友就提过了,我只是忙没去修正,昨天看到你重新提醒,就抽空修正下(文章里面的代码也修正了)

  4. oyoy says:

    z大都不太折腾了

    1. zwwooooo says:

      @oyoy
      大家都不折腾我折腾啥呢?哈

  5. 李大胆 says:

    加上去有盖楼的欲望吗

    1. zwwooooo says:

      @李大胆
      这只是细节问题,木有你说的目的

  6. 建站网 says:

    貌似没什么太大的用处,不过也可以试试

    1. zwwooooo says:

      @建站网
      这只是细节,好听点叫对访客友好

    2. 3.1415926 says:

      @zwwooooo hi我又来了。报个bug,发现开启分页的情况下倒叙输出的楼层会有错误。偶然发现,虽然我不用倒叙。

    3. zwwooooo says:

      @3.1415926 倒序报错一般可能是评论数获取失败导致,具体我就不去测试了,毕竟WP升级比较快,而自己工作忙比较少折腾,除非有朋友一定需要此功能(其实现在很少人折腾了)

  7. 只想弄懂评论倒叙!

  8. Dick_Wu says:

    等这阶段忙完了折腾一番

    1. zwwooooo says:

      @Dick_Wu
      慢慢来,少年,你真的是少年……

  9. 郑永 says:

    想来想去,自己硬着头皮去做一个属于自己的主题,过几天就换上,呵呵。
    在途中就用到你这个,很好很强大!不用到处折腾,呵呵,不过发现一个问题:$commentcountText .= ''; div后面多了一个引号?

    1. zwwooooo says:

      @郑永
      你已经换上了,我才回复。。。

  10. 郑永 says:

    那个floor div怎么一直显示在下方,我只能通过 magin-top 的负值给调到上面去。如何调到 编辑 按钮旁边啊?呵呵。。。

    1. zwwooooo says:

      @郑永
      用绝对定位啊,position啊

  11. 郑永 says:

    嵌套的样式整不出来,不喜欢原生的那种圈圈模式,结果就设置成border-top: 2px solid #cccccc ,虽然圈圈没了,显示一条顶部线条,但是底部怎么说都会有留大空隙,于是把bottom值设置负的,减少一些,有时间肯定得整整,貌似就你这一段代码加点样式就OK ?以前没整过这个。

    1. zwwooooo says:

      @郑永
      一般css就能搞定,除非你的样式特别才需要改评论结构

    2. 郑永 says:

      @zwwooooo
      哈哈,我是cp党,以前复制了你这个评论结构,今天要加上你的另一个回复加@符号的方法,结果要为cp付出代价,哈哈。。。观察一下,才发现,你说蓝色部分就可以了,我以前全部复制过去,今天小改了一下才能适应那个加@方法~~。

    3. 郑永 says:

      @zwwooooo
      话说 <?php comment_reply_link(array_merge( 刚改?记得以前是 a 开头啊。。

    4. 郑永 says:

      @zwwooooo
      为什么你改的这句,ajax就出错呢?我纠结。。。两个输出这样:
      回复
      回复

    5. 郑永 says:

      @zwwooooo 终于解决了ajax评论框移动到回复下面的问题,硬着头皮把官方的评论加你的蓝色部分代码,接着一个一个整,就没问题了,呵呵。

    6. zwwooooo says:

      @郑永
      这是生成链接的函数

    7. zwwooooo says:

      @郑永
      哈哈,慢慢折腾还是能搞定的

  12. 一直用你的楼层代码,那个好像是不能倒序,有空试试这个。。

    1. zwwooooo says:

      @皇家元林
      倒序的也写过,不过现在这个版本好点。

  13. 我用多说的,呵呵

    1. zwwooooo says:

      @老妖互联网博客
      不喜欢用第三方

  14. 折子戏 says:

    测试之后发现这个评论代码,似乎只能实现正序排列,如果倒序排列的话,而且还有评论嵌套,那么久无法实现正常的楼层。

    1. zwwooooo says:

      @折子戏
      我测试是OK的,而且这个只对主评论排序。

  15. 子非我 says:

    好像要开启评论分页才能显示楼层数,没开启的话就没显示,这个是我个人的问题吗??
    2013年1月4日12:49:05

    1. 子非我 says:

      @子非我
      看到前提了,是要开启分页……

    2. 子非我 says:

      @子非我
      倒序貌似有些问题,分页为5条,不足5条的时候第一条也显示为5楼……

    3. zwwooooo says:

      @子非我
      请注意我写的“前提”

    4. zwwooooo says:

      @子非我
      诶?按道理不会啊,有时间再看看。

  16. 咚门 says:

    每次都能搜到你这来。。。

    1. zwwooooo says:

      @咚门
      这……抱歉 ^_^

  17. bloodface says:

    http://zww.me/archives/25716
    你这个评论的楼层代码怎么用啊 你修改的代码都放在function里吗

    1. zwwooooo says:

      @bloodface
      原代码都注明在functions.php,修改的当然也是。

  18. 大发 says:

    倒序的有问题,主要问题就是那句获取主评论数的sql不能获取主评论数

    1. zwwooooo says:

      @大发
      我以前测试是ok哦,而且几个朋友也用上了,是wp版本问题还是你主题问题呢?好久没去折腾了

    2. 大发 says:

      @zwwooooo
      应该不是主题问题吧,我翻前面的评论也有人反应这个bug了。。我echo总评论数是0,你懂的。。

    3. zwwooooo says:

      @大发
      诶?我还帮人改过呢,正常工作,奇怪了

  19. says:

    博主,我把您分享的代码(有蓝色部分)粘贴到function.php后面,结果没效果出来,也按照您说的前提做了。第二步的时候是不是还要修改什么啊?

    1. zwwooooo says:

      @树
      wp_list_comments() 里面有设置对回调函数参数么?这个功能不能硬套,需要一点基础wp主题制作知识,多看看官方文档

  20. Pang says:

    总算搞定了。 谢谢
    我用你的SQL语句查询不到主评论总数量。删除掉AND comment_type = 'all'就可以了。
    或者别人的办法。
    get_comments( array('status' => 'approve','parent' => '0','post_id' => get_the_ID(),'count' => true) );也能办到

回复给 zwwooooo ¬
取消回复

昵称 *

网址

B em del U Link Code Quote