How to add clickable icons to your WordPress sidebar

Post image for How to add clickable icons to your WordPress sidebar

by bledsoe on July 28, 2009

You know how a lot of WordPress blogs have nifty icons in one of the sidebars, ones you can click on to go to, say, that blogger's twitter or facebook page?  They're really simple to add.

It's essentially a 2-step process:

  1. Upload the icon image(s) to your media library.  You can find a ton of free icons online.  Check out these sites for a few examples.
  2. Add a "Text" widget to your sidebar and insert code similar to the following:

<a href="http://twitter.com/bledsoe"><img src="http://www.lancebledsoe.com/wp-content/uploads/2009/07/tweeter_48x48.png" /></a>
<a href="http://www.facebook.com/lancebledsoe"><img src="http://www.lancebledsoe.com/wp-content/uploads/2009/07/facebook_48.png" /></a>
<a href="mailto:lance@lancebledsoe.com"><img src="http://www.lancebledsoe.com/wp-content/uploads/2009/07/email_48x48.png" /></a>
<a href="http://www.lancebledsoe.com/feed/"><img src="http://www.lancebledsoe.com/wp-content/uploads/2009/07/rss_48x481.png" /></a>

Then just change the URLs in the code so that they point to your icons and links (instead of mine).  You may also need to adjust the width of your sidebar or the size of your icons so that they all fit.

And that's it!  So find a few cool-looking icons and go nuts!

Previous post:

Next post: