以背景色区分Blog作者评论与普通评论

这里指的是在WordPress中,判断是否Blog作者,并且在评论内容调用不同的CSS来实现Blog作者评论跟普通评论的区分。实现方法很简单,网上也有很多实现方法。自从使用了PureCSS这个主题后,炜煜或多或少对主题的摆弄有点了点兴趣。所以下面我继续用我这个修改过的主题来举例说明。

根据文章开头的意思,其实就是自定评论样式的一种。会修改到2个文件,1个是functions.php 。一个是style.css 。判断是否为Blog作者并且使用不同样式的主要代码如下:

<?php
	$isByAuthor = false;
	if($comment->user_id != 0)
	{
		$isByAuthor = true;
	}
	if ($isByAuthor == true)
	{
	$oddcomment = 'commentcontent-author';
	}
	else
	{
	$oddcomment = 'commentcontent';
	}
?>

解释:commentcontent-authorcommentcontent就是2个不同的样式。当判断为Blog作者时,调用了commentcontent-author这个样式。我把这个判断放到了自定义 Comments 列表函数里面。接着把需要变色的那个div的样式修改为

class="<?php _e($oddcomment); ?>"

这样functions.php就修改好了。这样,我的整个自定义评论的函数如下:

<?php
function custom_comments($comment, $args, $depth) {
    $GLOBALS['comment'] = $comment;
    global $commentcount;
    if(!$commentcount) $commentcount = 0;
    $commentcount ++;
    global $commentalt;
    ($commentalt == "alt")?$commentalt="":$commentalt="alt";   
?>
    <?php
			$isByAuthor = false;
			if($comment->user_id != 0)
			{
				$isByAuthor = true;
			}
			if ($isByAuthor == true)
			{
				$oddcomment = 'commentcontent-author';
			}
			else
			{
				$oddcomment = 'commentcontent';
			}
		?>
    <li <?php comment_class(); ?> id="comment-<?php comment_ID(); ?>">
 
    <div class="commentmetadata <?php echo $commentalt?>"><strong><?php echo $commentcount ?>.</strong> <cite><?php comment_author_link( ); ?></cite> | <small><?php comment_date( ); ?> at <?php comment_time(); ?> | <a href="#comment-<?php comment_ID( ); ?>">#</a></small></div>
        <?php echo get_avatar( $comment, 32 ); ?>
        <div class="<?php _e($oddcomment); ?>"><?php comment_text( ); ?>
        <?php edit_comment_link('Edit Comment','<span class="editlink">','</span>'); ?>
        <?php comment_reply_link(array('depth' => $depth, 'max_depth'=> $args['max_depth'], 'reply_text' => "回复该留言"));?></div>
<?php } ?>

style.css中,我增加了commentcontent-author这个样式。其实就是拷贝一次commentcontent,然后修改为commentcontent-author,另外加上背景颜色或是背景图片的样式即可。我这里的内容如下:

.commentcontent-author{
  border: 1px solid #bfbfbf;
  padding: 2px 8px;
  background:#f2f7f8
}

这里的实现方法是参考了dupola的主题:Twitter Theme
另外,推荐乔布鲁的这篇文章:如何高亮你的评论背景色。有举例说明哦。而且我这里使用的其实就是该篇文章介绍的方法一。

《以背景色区分Blog作者评论与普通评论》上有5条评论

发表评论

电子邮件地址不会被公开。 必填项已用*标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据