Gravatar’s have been popular for years now – and to date they’re integrated across a plethora of websites – serving over 8.6 million avatars every single day. With that said there are also a ton of plugins available for most blog and CMS scripts; however what if no plugin exists for our website, or we simply want to do it ourselves? Luckily Gravatar has an extremely easy to use API, and in this tutorial we will go over how to use PHP to display a users Gravatar image.

First off we must understand that Gravatars work off a users registered email address – so in order for us to go further we have to make sure that we are, somehow, getting the users email address. Gravatar then creates an MD5 hash of a users email address and stores their Gravatar image under that name. Luckily PHP has a built-in MD5 function which we can make use of to convert our email address. BUT FIRST we also have to convert our email address to all lowercase. See MD5 will generate a different hash for uppercase letters than lowercase letters, and to match Gravatar we need all lowercase.

$userEmail = "[email protected]";
//convert email to lowercase
$userEmail = strtolower($userEmail);
//convert to MD5 Hash
$userEmailHash = md5($userEmail);

Now we have an MD5 hash (like 14c4b06b824ec593239362517f538b29). If we go find a Gravatar in-use anywhere else and view the URL for the image we will see the following:

http://www.gravatar.com/avatar/14c4b06b824ec593239362517f538b29

So all we need to do is take our MD5 hash and create the same URL with it, and embed it onto our website with an IMG tag:

echo "";

Technically we can end right there – but there’s a few more settings that the Gravatar API allows you to make use of – and If you’re interested feel free to read on.

Setting The Size

The Gravatar API will, by default, show an image that is 80×80 – however if you want to show something smaller, or larger, you can do so using the API. For this we’re going to add to our Gravatar URL the parameter s and give it our desired size:

//set a size variable
$size = "150";
//echo gravatar
echo "";

Setting A Default Avatar To Display

Granted Gravatar’s are extremely popular – but not everyone is going to have one. With that in-mind we need to fail gracefully if we run this function on an email address that doesn’t have a Gravatar. For this we can use the d parameter and give it the URL of your default avatar. Since we’re going to be passing a full URL we’ll want to URL-encode our default avatar link to ensure the script functions properly.

$defaultAvatar = "http://icons.iconarchive.com/icons/guillendesign/variations-3/256/Default-Icon-icon.png";
//convert default avatar URL to urlencoded
$defaultAvatar = urlencode($defaultAvatar); 
//echo gravatar
echo "";

[divider style=”solid” top=”10″ bottom=”10″]

In the end here is the full code breakdown. If you want you can also fork the code over at Github.

//start with some settings
$userEmail = "[email protected]";
$size = "150";
$defaultAvatar = "http://icons.iconarchive.com/icons/guillendesign/variations-3/256/Default-Icon-icon.png";


//convert email to lowercase
$userEmail = strtolower($userEmail);
//convert to MD5 Hash
$userEmailHash = md5($userEmail);

//convert default avatar URL to urlencoded
$defaultAvatar = urlencode($defaultAvatar); 

//echo gravatar
echo "";

Published by Michael Boguslavskiy

Michael Boguslavskiy is a full-stack developer & online presence consultant based out of New York City. He's been offering freelance marketing & development services for over a decade. He currently manages Rapid Purple - and online webmaster resources center; and Media Explode - a full service marketing agency.

Join the Conversation

2 Comments

Leave a comment

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