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;
}

Go to Utah Liberation to see this code in action: utahliberation.com (bottom of the sidebar)

Tags: , , ,

This entry was posted on Friday, May 13th, 2011 at 12:53 pm and is filed under How To, WordPress, web design. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.

7 Responses to “WordPress Recent Comments with Excerpt and Gravatar”

  1. Luigi Says:

    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 Says:

    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 Says:

    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. Uchan Says:

    Thanks a lot, it works on my blog 😀

  5. Brian Mecham Says:

    @Luigi, I did a test and copied the code as is into my single.php to make the recent comments show above the posts and it worked just fine.

  6. Brian Mecham Says:

    @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”

  7. acul Says:

    thx 4 the code. im really looking for this.

    by the way. how do i remove author post comment…?

Leave a Comment