How to Create a Custom Style for Admin Comments in WordPress
by Bandicoot Marketing on | Posted in Tutorials | 9 comments
I noticed how on some WordPress blogs authors’ comments are styled differently from other people’s comments. I think this really makes it easier when users are scanning through your comments, looking for an actual moderator/author/admin’s response. Making your WordPress install style your author comments differently is quite a simple little coding modification where you only need to change a small piece of code in one file and add a style class to your CSS stylesheet.
This works only on WordPress 2.5.
Open up your themes comments.php file and look for line 27. Should look something like this…
<?php foreach ($comments as $comment) : ?> <li <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>"> <?php echo get_avatar( $comment, 32 ); ?> <cite><?php comment_author_link() ?></cite> Says: <?php if ($comment->comment_approved == '0') : ?> <em>Your comment is awaiting moderation.</em> <?php endif; ?> <br /> <small class="commentmetadata"><a href="#comment-<?php comment_ID() ?>" title=""><?php comment_date('F jS, Y') ?> at <?php comment_time() ?></a> <?php edit_comment_link('edit',' ',''); ?></small> <?php comment_text() ?> </li>
All you need to do is add is a little if statement to check if your author is an admin, and then a few more things. Copy the code below and paste it over the code above.
<?php foreach ($comments as $comment) : ?> <?php if (1==$comment->user_id) { ?> <li <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>"> <div class="authorcomment"></div> <small class="commentmetadata"><a href="#comment-<?php comment_ID() ?>" title=""><?php comment_date('F jS, Y') ?> at <?php comment_time() ?></a> <?php edit_comment_link('edit',' ',''); ?></small> <?php comment_text() ?> </li> <?php } else { ?> <li <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>"> <?php echo get_avatar( $comment, 32 ); ?> <cite><?php comment_author_link() ?></cite> Says: <?php if ($comment->comment_approved == '0') : ?> <em>Your comment is awaiting moderation.</em> <?php endif; ?> <br /> <small class="commentmetadata"><a href="#comment-<?php comment_ID() ?>" title=""><?php comment_date('F jS, Y') ?> at <?php comment_time() ?></a> <?php edit_comment_link('edit',' ',''); ?></small> <?php comment_text() ?> </li> <?php } ?>
Then just add the “authorcomment” class to your CSS stylesheet and style it however you choose. Mine looks something like this.
.authorcomment { background: url(images/bavota.png) no-repeat; float: left; width: 89px; height: 97px; }
See below how my comments have the “B” logo on the left. You can add a background color or place the image differently or do whatever you choose to have a custom style for your author comments.
9 comments for “How to Create a Custom Style for Admin Comments in WordPress”