How to make a wordpress widget

This is a translation from my original post in spanish. I hope you enjoy it! 🙂

Continuing with the make your own wordpress theme guide, it is possible that you come to the point where you need a new module you don’t have in the sidebar, more known as widget.

There are a few ways for doing this, in one side since you can choose between a dynamic and an static sidebar you could choose the second one and just develop it in php in one piece, though it will not be editable from the administration panel. Another option is to enter in the admin panel and create a text widget which you can use to insert javascript or HTML code.

But the problem comes in case you want to edit the sidebar without having to touch the sourcecode, or that a widget starts having problems, or we want to make a backup or update to a new version, the maintenance will become more expensive. That’s why the slowest option but the best in long term it’s to build a new widget and install it through the admin panel.

How do I make a new widget?

To make a new widget its easy, you only need to follow these steps:

1. Create a php file for writing your widget, for example, mywidget.php
2. Include and edit on that file the code lines I show you down.
3. Put the file mywidget.php on the folder wp-content/plugins/
4. In the admin panel, find and install the widget in the plugins section.
5. In the admin panel, drag the widget to the sidebar in the section design->widgets.

This is the code you have to include in the file mywidget.php:

<?php
/*
Plugin Name: MiWidget - Feed RSS
Plugin URI: http://www.entrecodigos.com/
Description: Enlaces para suscribirse al feed del blog
Author: Rubén Cantón
Version: 1
Author URI: http://www.entrecodigos.com/
*/

function miwidget_rss() {
    echo "<div class='sidebar-rss'>";
    echo "<img src='./wp-content/plugins/miwidget/rss.gif' alt='rss'/>";
    echo "<a href = \"http://feeds.feedburner.com/entrecodigos/ \">Feed de artículos</a>";
    echo "</div>";
}

function init_miwidget_rss(){register_sidebar_widget("Mi Widget - Feed RSS", "miwidget_rss");}

add_action("plugins_loaded", "init_miwidget_rss");
?>

As well as when we make the style.css, the comments on the beggining are used to identify your widget in the admin panel.

The used methods are as follows:

add_action: Stablishes that when the selected event occurs (on this case, when the plugins are loaded) the stablished method will be executed. Notice that this function its writed out of any function, so it will be executed always just on loading the php file.

register_sidebar_widget: Registers a widget stablishing its name (which will be displayed at the widgets admin panel) and the function which has to be called when executed.

What we must not forget

• Don’t forget that there are free made widgets for wordpress.
• When you make your own functions, remember always to stablish a prefix impossible to coincide, or else you could generate a conflict between other wordpress functions or another plugin you may install.
• You can make a folder for your plugin and put images, styles or whatever you may want on it, as I’ve done in the example.