Display Gravatar on your blog or site.

Display Gravatar on your blog or site.

What is Gravatar?

Gravatar is an image which helps you getting recognized on various posts on blogs and web forums, without taking the pain of uploading your image on each of them, in short it help identifying your posts on blogs and web forums. For more details visit https://en.gravatar.com/.

How to display a Gravatar?

In order to display Gravatar you need to construct a url. So let’s break down our task in steps in which we will be constructing the Gravatar image url.

In order to get a Gravatar we need to know the email id with which the person’s Gravatar is linked.

So let’s have a method which takes email id as input and provide the image link for that person.

 

public string GetGravatarImageLink(string emailId)
{
string imageUrl = String.Empty;
if (!string.IsNullOrEmpty(emailId))
{
var encoder = new UTF8Encoding();
var md5Hasher = new MD5CryptoServiceProvider();
byte[] hashedBytes = md5Hasher.ComputeHash(encoder.GetBytes(emailId));
var sb = new StringBuilder(hashedBytes.Length * 2);
foreach (byte hasgedByte in hashedBytes)
{
sb.Append(hasgedByte.ToString("X2"));
}

imageUrl = string.Format("{0}{1}", "http://www.gravatar.com/avatar/", sb.ToString().ToLower());
}

return imageUrl;
}

 

In this method we compute md5 hash of the email id append that to http://www.gravatar.com/avatar/ so that we can get the Gravatar.

With this we get the default Gravatar image of size 80 X 80. Ideally you can get image size ranging from size 1 X 1 to 512 X 512. So now let’s change our method to get image url which can give us Gravatar of desired size.

 

public string GetGravatarImageLink(string emailId, float imageSize = 80)
{
string imageUrl = String.Empty;
if (!string.IsNullOrEmpty(emailId))
{
if (imageSize < 1 || imageSize > 512)
{
imageSize = 80;
}

var encoder = new UTF8Encoding();
var md5Hasher = new MD5CryptoServiceProvider();

byte[] hashedBytes = md5Hasher.ComputeHash(encoder.GetBytes(emailId));

var sb = new StringBuilder(hashedBytes.Length * 2);
foreach (byte hasgedByte in hashedBytes)
{
sb.Append(hasgedByte.ToString("X2"));
}

imageUrl = string.Format("{0}{1}??size={2}", "http://www.gravatar.com/avatar/", sb.ToString().ToLower(), imageSize);
}

return imageUrl;
}

 

While creating a Gravatar one has opted to upload different images for different audience, which is called as rating. Below are the different ratings available:
• G: suitable for display on all websites with any audience type.
• Pg: may contain rude gestures, provocatively dressed individuals, the lesser swear words, or mild violence.
• R: may contain such things as harsh profanity, intense violence, nudity, or hard drug use.
• X: may contain hardcore sexual imagery or extremely disturbing violence.

If the requested email hash does not have an image meeting the requested rating level, then the default image is returned.

So now let’s change our method again to fetch Gravatar based on rating provided.

 

public enum GravatarRating
{
Default,
G,
Pg,
R,
X
}

public string GetGravatarImageLink(string emailId, float imageSize = 80, GravatarRating rating = GravatarRating.Default)
{

string imageUrl = String.Empty;
if (!string.IsNullOrEmpty(emailId))
{
if (imageSize < 1 || imageSize > 512)
{
imageSize = 80;
}

var encoder = new UTF8Encoding();
var md5Hasher = new MD5CryptoServiceProvider();

byte[] hashedBytes = md5Hasher.ComputeHash(encoder.GetBytes(emailId));

var sb = new StringBuilder(hashedBytes.Length * 2);
foreach (byte hasgedByte in hashedBytes)
{
sb.Append(hasgedByte.ToString("X2"));
}

imageUrl = string.Format("{0}{1}?size={2}&rating={3}", "http://www.gravatar.com/avatar/", sb.ToString().ToLower(), imageSize, rating);
}

return imageUrl;
}

 

We are done 🙂

Shashank Bisen

Shashank Bisen is curious blogger and speaker who love to share his knowledge and experience which can help anyone in their day to day work.