Styling Admin comments in WP 3.1.3

Question

There's a lot of documentation on how to style 'autor' or 'admin' comments in WP, but most of it seems wildly outdated.

I have a client for whom I am developing a Q&A site. I always figure it's best to use whatever tools Wordpress has already provided me with. That's why I decided to set up a form which pushes all "questions" to a custom post type. Which my client can then read and comment on with his answer.

The only problem I've run into is that I need to style his comments in a couple ways. They need to stand out. This is easy enough to achieve really, as WP now dynamically generates a class for each authors comments. So I just wrote a little CSS for that:

.comment-author-myClient {
background-color: #bcd1f7;
padding: 10px;
border: 1px dotted black;
}

That did the job of making his comments look different. But it's still not quite enough. I really want to edit his specific comment template. Instead of it saying something like 'user says:" I want it to say "myClient's Answer:"

I would also like for his comments to -always- remain at the top.

Now, that shouldn't ever really become an issue, as standard WP comments are displayed in ASC format, so as long as is the first to comment (which he should always be) his comment should always be at the top. But, I just want to be safe.

Additionally, I would like for his comment to appear before:

X responses to "post-title":

Just to make it easy for everyone who is going to try and help me.. Here is the twentyten comments.php file:

<?php
/**
 * The template for displaying Comments.
 *
 * The area of the page that contains both current comments
 * and the comment form.  The actual display of comments is
 * handled by a callback to twentyten_comment which is
 * located in the functions.php file.
 *
 * @package WordPress
 * @subpackage Twenty_Ten
 * @since Twenty Ten 1.0
 */
?>

            <div id="comments">
<?php if ( post_password_required() ) : ?>
                <p class="nopassword"><?php _e( 'This post is password protected. Enter the password to view any comments.', 'twentyten' ); ?></p>
            </div><!-- #comments -->
<?php
        /* Stop the rest of comments.php from being processed,
         * but don't kill the script entirely -- we still have
         * to fully load the template.
         */
        return;
    endif;
?>

<?php
    // You can start editing here -- including this comment!
?>

<?php if ( have_comments() ) : ?>
            <h3 id="comments-title"><?php
            printf( _n( 'One Response to %2$s', '%1$s Responses to %2$s', get_comments_number(), 'twentyten' ),
            number_format_i18n( get_comments_number() ), '<em>' . get_the_title() . '</em>' );
            ?></h3>

<?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : // Are there comments to navigate through? ?>
            <div class="navigation">
                <div class="nav-previous"><?php previous_comments_link( __( '<span class="meta-nav">&larr;</span> Older Comments', 'twentyten' ) ); ?></div>
                <div class="nav-next"><?php next_comments_link( __( 'Newer Comments <span class="meta-nav">&rarr;</span>', 'twentyten' ) ); ?></div>
            </div> <!-- .navigation -->
<?php endif; // check for comment navigation ?>

            <ol class="commentlist">
                <?php
                    /* Loop through and list the comments. Tell wp_list_comments()
                     * to use twentyten_comment() to format the comments.
                     * If you want to overload this in a child theme then you can
                     * define twentyten_comment() and that will be used instead.
                     * See twentyten_comment() in twentyten/functions.php for more.
                     */
                    wp_list_comments( array( 'callback' => 'twentyten_comment' ) );
                ?>
            </ol>

<?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : // Are there comments to navigate through? ?>
            <div class="navigation">
                <div class="nav-previous"><?php previous_comments_link( __( '<span class="meta-nav">&larr;</span> Older Comments', 'twentyten' ) ); ?></div>
                <div class="nav-next"><?php next_comments_link( __( 'Newer Comments <span class="meta-nav">&rarr;</span>', 'twentyten' ) ); ?></div>
            </div><!-- .navigation -->
<?php endif; // check for comment navigation ?>

<?php else : // or, if we don't have comments:

    /* If there are no comments and comments are closed,
     * let's leave a little note, shall we?
     */
    if ( ! comments_open() ) :
?>
    <p class="nocomments"><?php _e( 'Comments are closed.', 'twentyten' ); ?></p>
<?php endif; // end ! comments_open() ?>

<?php endif; // end have_comments() ?>

<?php comment_form(); ?>

</div><!-- #comments -->

And here is the part of functions.php that it refers to:

if ( ! function_exists( 'twentyten_comment' ) ) :
/**
 * Template for comments and pingbacks.
 *
 * To override this walker in a child theme without modifying the comments template
 * simply create your own twentyten_comment(), and that function will be used instead.
 *
 * Used as a callback by wp_list_comments() for displaying the comments.
 *
 * @since Twenty Ten 1.0
 */
function twentyten_comment( $comment, $args, $depth ) {
    $GLOBALS['comment'] = $comment;
    switch ( $comment->comment_type ) :
        case '' :
    ?>
    <li <?php comment_class(); ?> id="li-comment-<?php comment_ID(); ?>">
        <div id="comment-<?php comment_ID(); ?>">
        <div class="comment-author vcard">
            <?php echo get_avatar( $comment, 40 ); ?>
            <?php printf( __( '%s <span class="says">says:</span>', 'twentyten' ), sprintf( '<cite class="fn">%s</cite>', get_comment_author_link() ) ); ?>
        </div><!-- .comment-author .vcard -->
        <?php if ( $comment->comment_approved == '0' ) : ?>
            <em class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.', 'twentyten' ); ?></em>
            <br />
        <?php endif; ?>

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

        <div class="comment-body"><?php comment_text(); ?></div>

        <div class="reply">
            <?php comment_reply_link( array_merge( $args, array( 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>
        </div><!-- .reply -->
    </div><!-- #comment-##  -->

    <?php
            break;
        case 'pingback'  :
        case 'trackback' :
    ?>
    <li class="post pingback">
        <p><?php _e( 'Pingback:', 'twentyten' ); ?> <?php comment_author_link(); ?><?php edit_comment_link( __( '(Edit)', 'twentyten' ), ' ' ); ?></p>
    <?php
            break;
    endswitch;
}
endif;

All the documentation I have found thus far on modifying admin comments has been from a previous version of WP and Twentyten, where the comments loop is all stored in comments.php, and has a much different format. So any help with the goals I am trying to achieve here would be very, very appreciated.

TIA

Answer 1

Why not use:

if ( user_can( $comment->user_id, 'administrator' ) ) {
     // current comment is from an administrator;
     // do something
}

As for putting the admin comments at the top of the comment list, you would have to modify the comment query itself.

Answer 2

I did figure this out. Though there may be a cleaner way to do it. I don't know.. Here is my new functions.php file...

<?php /* If the author is myclient, use class 'author' otherwise, use class 'comment byuser' */
   if ($comment->comment_author_email == "[email protected]")
   echo '<li class="author">';
   else
   echo '<li class="comment byuser">';
   /* I had to make this li class static because I don't know how 
      to inject PHP in an echo that's in an if/else statement. 
      echo 'stuff here' . php here . 'more stuff'; did not work. 
    */
   ?>

        <div id="comment-<?php comment_ID(); ?>">
        <div class="comment-author vcard">

            <?php /* get user avatar only if the author is NOT myClient */
            if ($comment->comment_author_email !== "[email protected]")
            echo get_avatar( $comment, 40 ); 
            ?> 

            <?php if  /* if the user is myClient, append "myClient answers" instead of the author link. Otherwise, proceed as normal. */
            ($comment->comment_author_email == "[email protected]")

             printf( __( '<b>myClient Answers:</b>', 'twentyten' ), sprintf( '<cite class="fn">%s</cite>', get_comment_author_link() ) );           
            else

             printf( __( '%s <span class="says">replies:</span>', 'twentyten' ), sprintf( '<cite class="fn">%s</cite>', get_comment_author_link() ) ); 
             ?>


        </div><!-- .comment-author .vcard -->
        <?php if ( $comment->comment_approved == '0' ) : ?>
            <em class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.', 'twentyten' ); ?></em>
            <br />
        <?php endif; ?>

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

        <div class="comment-body"><?php comment_text(); ?></div>
        <div class="reply">
            <?php comment_reply_link( array_merge( $args, array( 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>
        </div><!-- .reply -->
    </div><!-- #comment-##  -->
    </li> 
   <?php if /* if the comment is by myClient, append this div after it. */($comment->comment_author_email == "[email protected]")
   echo '<div id="commentdivider"></div>';
   echo '<br>';
   ?>
    <?php
            break;
        case 'pingback'  :
        case 'trackback' :
    ?>
    <li class="post pingback">
        <p><?php _e( 'Pingback:', 'twentyten' ); ?> <?php comment_author_link(); ?><?php edit_comment_link( __( '(Edit)', 'twentyten' ), ' ' ); ?></p>
</li>
    <?php
            break;
    endswitch;
}
endif;

then you just style the class you assigned to the admin comments, like so....

.author {
line-height: 24px;
padding: 20px;
position: relative;
background-color: #EDEFF4;
margin-bottom: 25px;
} 

You can do some tweaking of the other comments as well to make them look nice. I just changed the margin and padding a bit. Here is a screenshot of the finished product:

I just took "x responses to post-title" out of the equation completely.

Answer 3

Find the list-item where the comment content is located(usually in comments.php) and add the following in the class-tag:

if (1 == $comment->user_id)
echo 'author';

Now style the css-class .author!