SSbits - Home page
Site by Carbon Crayon
Submit a Post >

Snippets - Little bits of code to make you happy

Adding Gravatars to your site

SSBgravatar

Gravatar is a great service that allows you to pull in members profile photos directly from their Gravatar accounts. It's used right here on SSbits and it also part of the Forum module. It's also incredibly easy to integrate into your site! 

Because we need to get the Gravatar for each member, we need to add this function to the Member Class via a decorator, so inside a new file mysite/code/MemberDecorator.php add the following:

<?php
class MemberDecorator extends DataObjectDecorator {
	
	function getMemberAvatarURL($Size = 100)
	{
		//Set the defalt avatar image
		$default = Director::absoluteBaseURL() . 'themes/MyTheme/images/DefaultAvatar.png';

		return "http://www.gravatar.com/avatar/".md5($this->owner->Email)."?default=".urlencode($default)."&amp;size=" . $Size;		
	}
}

All we are doing here is first  setting the default image (which will be used if they don't have a Gravatar account), then contructing the link to fetch the image. Notice the use or $this->owner->Email, this is because we are in a decorator, so $this won't know to reference the Class we are decorating. We also pass in $Size so that we can easily define the size of the image we want. Currently Gravatar only supports square images. In order to register our decorator you need to add this to the mysite/_config.php file:

 

Object::add_extension('Member', 'MemberDecorator');

Then in your template, you can simply do:

 

<img src="$CurrentMember.MemberAvatarURL" alt="Avatar" />

Overriding with Local Avatar

Often you will want to give the user the option to override the Gravatar with a different image (like here on SSbits). To do that we just need to provide an if() statement that checks for a local image and if it finds one then return it, otherwise it returns the Gravatar. Your function would look something like this:

	function getMemberAvatarURL($Size = 100)
	{
		//Set the defalt avatar image
		$default = Director::absoluteBaseURL() . ContentController::SiteConfig()->DefaultAvatar()->CroppedImage($Size,$Size)->Link();
		
		// if they have uploaded an image
		if($this->owner->AvatarID && $avatar =  $this->owner->Avatar()) 
		{
			if($resizedAvatar = $avatar->CroppedImage($Size,$Size));
			{
				return $resizedAvatar->URL;
			}	
		}

		return "http://www.gravatar.com/avatar/".md5($this->owner->Email)."?default=".urlencode($default)."&amp;size=" . $Size;		
	}

Here we first check whether our Member has an avatar uploaded into the Avatar field and if they do we return a Cropped version of that, otherwise we go and fetch their Gravatar.

So there you go, it's as simple and effective as that!

Aram Balakjian avatar

Aram Balakjian

Aram is a web developer running London based agency Aab Web. He has a strong passion for developing attractive, usable sites around the SilverStripe CMS.

  • Invader_Zim
    08/10/2010 1:50am (4 years ago)

    Great article.

    I used a slightly different approach on one of my sites.
    First, i followed your post about adding email fields to page comments.
    Then in the PageCommentDecorator i have almost the same function to retrieve a Gravatar, but i use

    $email = $this->owner->getField('CommenterEmail'); instead.

    This way enables Gravatars also for non-members

    Cheers,
    Christian

  • gav
    08/10/2010 6:39am (4 years ago)

    Hey Aram, i also did a similar approach to invader_zim using one of your previous articles. Since we allow users to post comments without having a members account, we have added a field for their email address to the page comment form.
    http://chillburn.com.au/blog/adding-gravatar-images-to-the-silverstripe-blog/

  • Jeroen Marechal
    11/10/2010 8:46am (4 years ago)

    Great article Aram! I've been looking for something like this for a long time!

  • SamTheJarvis
    20/06/2011 12:06am (4 years ago)

    Any idea how this would work with the memberprofiles ajshort created?

  • Terry Apodaca
    16/06/2012 12:58am (3 years ago)

    This is still a good tutorial but shouldn't the image src= be changed to:

    <img src="$CurrentMember.MemberAvatarURL" alt="Avatar">

  • Aram Balakjian
    18/06/2012 7:15pm (3 years ago)

    Hi Terry,

    The tutorial mentions being in the context of Member, but perhaps this is not as clear as it could be, I think I will make it clearer, thanks for pointing it out :)

    Aram

Post a comment ...

You cannot post comments until you have logged in. Login Here.

Advertisement

Site of the Month

Find SSbits on

Top Contributers

Rank Avatar Name
1 article image Aram Balakjian
2 article image Daniel Hensby
3 article image Marcus Dalgren
4 article image Hamish Campbell
5 article image Ty Barho
6 article image Martijn van Nieuwenhoven
7 article image Darren-Lee
8 article image Roman Schmid
9 article image Matt Clegg
10 article image dalesaurus

View full leaderboard


Advertisement