Forums

[resolved] Comment avatar stretched help (6 posts)

  1. TOD1
    Member
    Posted 8 months ago #

    Changed the comment avatar to 50 x 50. The box changed okay. The avatar picture width changed but the height appears to have stayed at 64 and is now cut off.

    Please help, I'm going insane thing to fix it. First time using WP and CSS.

    http://www.troopsofdoomcomic.com/todcomic/
    http://www.troopsofdoomcomic.com/todcomic/2008/02/25/the-fly/#comments

  2. Big Bagel
    Member
    Posted 8 months ago #

    You should change the dimensions in the function that shows your comments rather than with CSS so that your gravatars are downloaded with the proper dimensions already. It depends on the theme, but it's probably generating your comment lists with wp_list_comments() in a file named comments.php. If so, you should add the 'avatar_size' to any arguments. For example:

    wp_list_comments( array( 'avatar_size' => 50 ) );

    If your theme doesn't use wp_list_comments() then it probably uses get_avatar() to show the gravatars instead, in which case you would use:

    get_avatar( $comment, 50 );

  3. TOD1
    Member
    Posted 7 months ago #

    Not using Gravatars, it's just the default avatar.

    Changed everything I could find in the comments.php relating to avatar size to 50 but nothing happened, avatar was still stretched and cut off.

  4. Big Bagel
    Member
    Posted 7 months ago #

    You are actually using gravatar. You can look at your site's source to see that it's polling gravatar for the images, not finding one for your email address, and serving your selected default which is a file located here:

    http://www.troopsofdoomcomic.com/todcomic/wp-content/themes/comicpress/images/avatars/default/rascal.png

    I also, see you're using comicpress. I'm familiar with the theme and know that it's comments.php file is annoyingly over-complicated. Assuming you're using the latest version (or your versions has the same comments.php as the latest versiosn) you should see this on line 28:

    'avatar_size'=>64

    Change it to:

    'avatar_size'=>50

    Then on line 32 you'll see:

    wp_list_comments(array('type' => 'comment', 'avatar_size'=>64));

    Change it to:

    wp_list_comments(array('type' => 'comment', 'avatar_size'=>50));

    That will tell gravatar to serve a 50px x 50px image for all non-trackback/pingback comments. The function automatically adds inline height and width attributes which is why, when you set height and width CSS rules for it's surrounding div with the class comment-avatar, it didn't properly contain the image.

    I suppose, if you want a less elegant solution, you could also change the height and width of the image by doing this in your style.css file to override the inline height and width attributes:

    .comment-avatar a img.avatar {
        height: 50px !important;
        width: 50px !important;
    }
  5. TOD1
    Member
    Posted 7 months ago #

    You are my hero! Thanks!

    Tried the comments.php changes first but it had no effect. Made the style.css changes next and it worked. It's changed in both files now, I hope that's okay?

    Only two more problems left to fix. So far. :p

  6. Big Bagel
    Member
    Posted 7 months ago #

    It's really just that bit of CSS scaling it down; the function is still serving a 64px X 64px image which is odd since you changed it in comments.php. However, as long as it looks the way you want, it's really not that big of a deal.

Reply

You must log in to post.

About this Topic