How to widgetize your blog or website

Susie Gardner from Hop Studios gave a pretty good demo of how to add widgets to your blog today at Northern Voice. Widgets, also called plugins or badges, are little apps which consist of bits of code that once added to your blog or website, pull in external information. They usually appear in the sidebar of your blog. These widgets could pull the latest news feed from a site such as Voxant, the latest Dilbert cartoon, a list of books you are reading or meaning to read, the weather, or a series of flickr photos.

These widgets can be a fun way to add content to your website. The only downside of adding these, is that you have to dabble in the code a bit which can be scary at first. Additionally if you’re blog is on a hosted platform such as WordPress.com or Typepad, you may not be able to add these.

So how do you go about adding a widget?
First let’s select a widget. Of all the widgets mentioned during the presentation, I found polldaddy.com the most interesting. As the name would suggest polldaddy allows you to create polls.

  1. First you need to go to their site and sign up for an account. This is done very easily simply by filling your name and email. (Don’t you love people who don’t ask you for every possible detail?)
  2. Next, hit create a poll.
  3. Type in your questions.
  4. Type in your answers,
  5. Select the “look” of your poll.
  6. Hit save and Voila!

You will then be sent to a new screen with code which may look scary, but here’s the catch. You don’t need to know how it works. Just copy and paste it. That’s it. And here’s the poll I just created:

Now, for this example, I’ve copied the poll in the body of my text. I don’t really want to clutter my sidebar with more stuff, but if I wanted to, I could have a permanent poll anywhere on my site. The beauty of this widget is that simply by login in to my polldaddy.com account and creating a new poll, the poll on my website is automatically updated.

I mentioned earlier that widgets usually appear in the sidebar of your blog. This is where dabbling in the code gets a bit tricky. If you’ve set up your own blog and have access to the presentation, you can go to the template editor, locate the sidebar.php and add the widget code in there. If you are like me and using WordPress which you’ve downloaded and customized, you can also use the widget editor, but be careful and make sure that you back up all of your files, just in case you mess things up.

I should also point out, that if you copy and paste code into the body of a post, like I just did, save the post and come back and edit it, chances are the code for your widget will need to be updated. The visual editor in WordPress seems to alter the code every time you save and edit. I’m not sure why, but it just does… So just add your code once you are happy with the post and no longer need to edit.

Have fun.

2 Responses to “How to widgetize your blog or website”

  1. Mhairi says:

    Is a “button” also a type of widget?

    Please share some of the other widgets you learned about in the presentation.

  2. Christine says:

    I’m not sure what you mean by a button. Technically speaking a widget pulls information from somewhere and places it on your site, so I don’t think that a button would qualify.

    For example displaying your latest flickr photos would be created by a flickr badge. They call their widget a badge for some reason.

Leave a Reply