WordPress Recent Comments with Excerpt and Gravatar

WordPress Recent Comments with Excerpt and Gravatar

I build a lot of WordPress websites and it’s great that there are so many plugins available for various functions, but sometimes I run into a situation where the right plugin just doesn’t exist (or if it does I didn’t find it). I needed a widget to display the WordPress recent comments with the comment excerpt and the users gravatar (globally recognized avatar). Here’s what I came up with, modified based on some code from others looking for a similar solution:

Put this into your sidebar template or elsewhere:

<?php $comments = get_comments('status=approve&number=5'); ?>
<h3 class="widget-title">Recent Comments</h3>
<ul class="recomm">
<?php foreach ($comments as $comment) { ?>
    <li class="recomm-wrapper"><?php
        $title = get_the_title($comment->comment_post_ID);
        echo get_avatar( $comment, '53' );
        echo '<span class="recommauth">' . ($comment->comment_author) . '</span>';
        ?> said: "<?php
        echo wp_html_excerpt( $comment->comment_content, 72 ); ?>.."
        on <a href="<?php echo get_permalink($comment->comment_post_ID); ?>"
           rel="external nofollow" title="<?php echo $title; ?>">
           <?php echo $title; ?> </a>
    </li>
<?php }  ?> </ul>

Here’s the CSS styling I’m using (you may need to modify it according to your theme):

ul.recomm {
	margin-left: 0;
	margin-bottom: 36px;
	list-style: none;
}
.recomm-wrapper {
   clear:both;
   min-height: 53px;
   margin-bottom: 14px;
}
.recomm .avatar {
   float:left;
   margin-top:5px;
   margin-right:10px;
   border: #d8d8d8 1px solid;
}
.recommauth {
	font-weight: bold;
}

8 comments on “WordPress Recent Comments with Excerpt and Gravatar

  1. Luigi on

    Hi Brian, thanks for this great snippet! Although I have a request: I would like to show the latest comment posted on a post on top of that post. The comments are shown at the end of the post but I want to also show the latest one below the post title.

    I tried to modify your code but with no result so far… If you think you can help me on that, it would be awesome! Thanks a lot! 🙂

  2. Luigi on

    Me again 🙂

    I also would like the link to go on the author’s comment and not on the post. I may be asking too much, sorry if I do but I’m new to PHP and I’m still learning *humble*

    Thanks!

  3. Simon on

    Thank you so much for sharing this! I’m currently using Disqus and although they allowed me to create a recent comments widget to my sidebar, the text would get misaligned and I could never get it to look the way I wanted it. Your PHP code here is pretty much exactly what I wanted.

    Is there a way to remove the bullet points? I tried appending !important next to list-style but it didn’t work. Could be my theme though.

  4. Brian Mecham on

    @Simon, you may have to modify this part of the css code to fit with your specific WordPress Theme: “#main .widget-area ul ul.recomm” because your theme might be using a different id and class for that area.

    Try changing “#main .widget-area ul ul.recomm” to “ul.recomm”

Leave a Reply

Your email address will not be published. Required fields are marked *