all posts

Add a widget to any web site with jQuery

Published to Blog on 26 Jan 2010

This is my next to last blog post about the new widgets on my home page.  The “Lastest Music” widget pulls data from my account. Currently I’m displaying the 12 artists/albums that I’ve listened to the most on over the last week. It shows the cover art for each album and links to the album’s page on


Like the Twitter widget, the Flickr widget and the YouTube widget, the widget is all JQuery/JavaScript all the time. Unlike most of the others, in this case I used an unmodified “stock” plugin. The plugin I chose is Jeroen Smeet’s plugin, which was designed for WordPress but works just fine on its own.

To implement the widget grab the script from the zip at the Wordpress Plugin Directory, add a script reference for it and jQuery on the page, add a container to hold the rendered HTML and add a few lines of JavaScript to wire it up.

That’s all there is to it. It doesn’t get much easier than that. Enjoy.

Dan Hounshell
Web geek, nerd, amateur maker. Likes: apis, node, motorcycles, sports, chickens, watches, food, Nashville, Savannah, Cincinnati and family.
Dan Hounshell on Twitter