I’ve been doing a bit of work on adding social media badges to the next version of gingerjam. To make things more sporting (ie difficult) I was determined to do this without a plug-in. This would give me more control over how it looked and behaved, which is kind of the point of being a designer.

Do I make my own icon set? I’m not saying that this wouldn’t be a useful or interesting challenge, but it would be a time consuming one that would prevent me getting on with the rest of the site. Thank the lord for people like Benjamin Reid: good hearted, talented people who make nice things and let other people use them. You can find his excellent collection of social media icons at: Nouveller

I made some white versions of the icons, and added a bit of CSS and jquery for a roll-over effect. So far so good. Now for a bit of functionality, each social site requires a link, in its own particular mark up in order to publish your link to your friends. The exact mark up isn’t always easy to find. Once again I’m in debt, this time to Perishable Press. I promise that the day I find out anything useful about anything I will publish it for free, right here on gingerjam.

I’ve tried to ensure that on the homepage links are for the site, whilst on post pages, it’s just for the that post. here’s the resulting code:

Then something similar for the other big social sites.