改造评论(comments)的显示

刚刚又对这个blog的排版CSS做了些细微的调整,其中关于用户评论comments部分有两条,随手记下来,免得下次更换外观主题的时候又忘记了。

第一个是评论背景用斑马色区分开,也就是单数评论用一个颜色,双数评论用另外一个颜色。这个是 Drupal自带支持的,不光是评论,其它table, block等都已经有了自动生成的$zebra CSS类。在comment.tpl.php里面一开头就有print $zebra这一句,就是给单复数评论制定不同的odd even class。所以我要做的无非是用直接定义CSS:
#comments .odd{
  background-color: #f8f8f8;
}


第二个就是希望作者自己的回复能够用特别的颜色单独标出。对个人blog来说这比较容易,因为作者有固定的uid,直接在comment.tpl.php里面在第一行的最后?>">前面加上下面这段代码就行了。这样就会给所有uid为一的用户评论加上selfcomment这个class。
<?php
print (uid==1) ? ' selfcomment' : '';
?>

如果是多人blog,稍微有点麻烦,需要判断当前comment是否与node为同一个uid,而在comment.tpl.php里面并没有$node这个变量。所以需要先修改template.php把$node传过来,或者也可以在template.php里面直接把所有逻辑判断都完成,直接传过来一个最终结果。这里我选择的传递$node变量,然后在comment.tpl.php里面作逻辑判断。没有别的原因,只是传递$node变量过来比较通用,说不定以后还可以派上别的用场。

  1. 先修改template.php,在function _phptemplate_variables函数下面,return $vars;之前,加入:
    <?php
     
    if ($hook == 'comment') {
        if ((
    arg(0) == 'node') && is_numeric(arg(1))) {
         
    $vars['node'] = node_load(arg(1));
        }
      }
    ?>

  2. 然后修改comment.tpl.php,在一开始的print ' '. $zebra; 之后加上:
    <?php
    print ($comment->uid == $node->uid) ? ' selfcomment' : '';
    ?>

  3. 最后就是CSS了:
    <?php
    #comments .selfcomment{
     
    background-color: #eeffee;
    }
    ?>


最终的效果,可以在这篇回复比较多的文章下看到。

Comments

1 - lync (未验证)
Thanks for the tip. The link at the end of the post doesn't work correctly. I think you have an extra /node in there.
2 - 大米
谢谢!已经修正了;)

发表新评论

此内容将保密,不会被其他人看见。
  • 允许的 HTML 标签: <blockquote> <div> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img>
  • You can use BBCode tags in the text, URLs will automatically be converted to links.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • Every instance of "<!--tableofcontents-->" in the input text will be replaced with a collapsible mediawiki-style table of contents. Accepts options for title, list style, minimum heading level, and maximum heading level as follows: <!--tableofcontents list: ol; title: Table of Contents; minlevel: 1; maxlevel: 3;-->. All arguments are optional and defaults are shown.
  • Every instance heading tags will be modified to include an id attribute for anchor linking.
  • Images can be added to this post.
  • 网页地址和电子邮件地址将会被自动转换为链接。

更多格式化选项信息