Quick WordPress Tip: Adding Custom HTML to Author Comments
Last night I was working on styling comments in the upcoming version of Marketers Delight and I discovered something that’s always been a curiosity in the back of my mind.
If you’re familiar with the WordPress comments system, you’ve more than likely styled author comments by targeting the bypostauthor
class WordPress automatically outputs to author comments.
This class is very useful as you can write custom CSS to make an author comment look different from everyone else’s comments. For example, you could change the background or border color to make it stand out a little more.
The problem is, it’s just CSS. If you wanted to do something like add a text badge next to the author’s comment that says something like “Post Author”, you’d either have to write a bunch of pseudo CSS or write some strange PHP (I’ve Googled this, and there aren’t any *great* answers).
A Simple Solution
WordPress provides us with the useful get_comment_class()
function (to be used in the comment function you set in the wp_list_comments()
call). As the Developer Reference describes it:
Returns the classes for the comment div as an array.
Return: (array) An array of classes.
…since it returns an array, you can easily check the data it returns by placing this somewhere in your comment function (make sure you delete it when you’re done, this is strictly for learning purposes):
<?php print_r( get_comment_class() ); ?>
and for each comment, you’ll see an array structure something like this:
Array ( [0] => comment [1] => byuser [2] => comment-author-username [3] => bypostauthor [4] => odd [5] => alt [6] => depth-2 )
Your results will vary slightly, but if you take a look at any of the author’s comments results, you’ll find that the bypostauthor
class is assigned to the array.
With this in mind, we can come up with a simple check with PHP to determine whether the current comment is the author’s or not:
<?php if ( in_array( 'bypostauthor', get_comment_class() ) ) : ?> ...html here... <?php endif; ?>
(Sean also posted another great way to check for author comments below)
All this check does is search the array (get_comment_class()
) for the bypostauthor
value. If it’s not there, the condition will return false and no HTML will be output (learn more about the in_array()
function).
Using this conditional you can add something like the text badge I mentioned above or even completely manipulate the entire author’s comment to differentiate from the rest of your comments.
To get an idea of what you could do with it, I’ve left a comment below this post to show you what author comments in MD look like. Happy commenting!
I’ve always wanted to do this on my own website…
FIRST!!!
Nice! You can also use the logic WordPress uses inside of the
get_comment_class()
function itself to determine if the comment is by the post author.It checks to see if the comment author ID matches the post author ID. If it does, it adds the
bypostauthor
class to the comment [?]. So you could use the following right in the comments template:if ( $comment->user_id === $post->post_author ) { … }
Not sure which one would be more efficient. I know
in_array()
can be pretty slow but I seriously doubt it matters with such a small array.Didn’t know about this one, nice (should have looked closer at the function)!
It seems more readable to me too. Now you’ve got me wondering which one would be more efficient… my thing was that I wanted to avoid calling any global variables (just preference, doesn’t actually matter in the real world).