How to Create Widgets: Dress Up Your Blog or Website With Customized Code Snippets

How to Create Widgets: Dress Up Your Blog or Website With Customized Code Snippets
Page content

Prepared Widgets or Complicated Code?

Bringing new elements into your website can be difficult, and often requires some complicated coding. If you use any of the popular blogging platforms you might find that someone has already made the first steps, and allowed the code that they created to be used by other people, which would obviously save a lot of time.

On the other hand, you might prefer to steer clear of these types of enhancements and plugins in favor of adding new features by using the vast selection of functional widgets that can be found on the web.

These can be added to a website or blog simply by adding pre-prepared, pre-formatted JavaScript code; it is as easy as embedding a YouTube video. In fact, thanks to some online services that provide widgets, it is possible to build your own!

Basic Widgets and Code

If you have found a widget online (perhaps at a site such as Widgetbox) you can add the code into your website or blog quite easily.

Pasting the code into a standard website or in the main column of a typical blog may require some additional CSS, so where possible take advantage of any sidebars that you might be using.

For example, if you had a food or cookery-related blog and wanted to add a related widget you would login to the admin dashboard of your blog, access the sidebar and add a blank widget into which you could paste the code before saving. This is how the majority of widgets appear on WordPress and Blogger sites.

Image credit: Screenshot by author.


A popular resource for anyone looking for a widget for the website, Widgetbox also provides a widget construction kit. This is useful for providing custom data that you wish to display on your website (for instance, if you follow a particular TV show or sport you might provide a widget-based list of coming broadcasts in the widget) and can be based on anything from RSS feeds to YouTube accounts.

To get started, visit Widgetbox site and select Make a Widget. Next, select the widget type, add any required information (such as a URL, an account name, etc.), click Make Widget and then adjust the settings on the default widget to suit your website.

It shouldn’t be too long before you have code for a widget that you can add to your blog or website – note that this method of creating widgets is ad-supported; however, you can sign up to Widgetbox and pay a fee to have the advertisements removed.

Premium Widgets

While paying a small fee to have your custom widget ad-free might not be an attractive option, widgets have become big business for many companies.

There is a thriving market in widget development, with customers typically choosing Facebook as their main target, and companies such as Webtrends and Sprouts offer customized widgets for advertising and other purposes for various prices, depending on your requirements.

If none of the widgets provided by Widgetbox do the job that you had in mind, you might choose to use one of these services or refresh your JavaScript skills to create a widget from scratch.