0

Okay so I have been trying to style my users Gravatar image. The problem is, the image becomes so blurry when I try to enlarge it even when the photo I uploaded on the test account is really at high res. I have seen gravatars on other sites that are about H:200px W:200px and the resolution of the photo is perfect. Now I think I may have tried to resize the photo in the incorrect way

<img class="img-circle" height="200px" width="200px" src="<?php echo $profile->get_gravatar($profile->getField('email'), false, 54); ?>"/>

I added the height and the width right after the img class="img-circle" which I believe is probably incorrect? Here is also images of what it looks like, and what it should look like.

Correct (coming from photoshop)

enter image description here

enter image description here

Incorrect and blurry ( live from site). Notice the server distortion.

I guess what I need is to tell the CSS to pull the original size of the photo from Gravatar and display it at its regular resolution because just adding the width and size directly to the tag will just blow it up on the site. Any ideas on how to fix this?

animuson
  • 53,861
  • 28
  • 137
  • 147
Miura-shi
  • 4,409
  • 5
  • 36
  • 55
  • What does the code for `$profile->get_gravatar` look like? – j08691 Oct 11 '12 at 19:03
  • 1
    Have you tried simply requesting a larger image from Gravatar? By default (when no size is specified), the image is only 80x80 pixels... I see the number 54 in your code, so I assume you're probably requesting a 54x54 image. – animuson Oct 11 '12 at 19:04

1 Answers1

4

When you get the Gravatar image URL, you tell the server what resolution to fetch. Right now you are asking for a 54x54 pixel image:

<?php echo $profile->get_gravatar($profile->getField('email'), false, 54); ?>

Change that last number to 200 (to match the size you want to display) and you should be fine.

benzado
  • 82,288
  • 22
  • 110
  • 138