Phew! We made it!

So, all we need to do is add one final little bit. Really little bit…

function widgetTutorial_init() {
  // These are the WordPress functions which will register
  // the widget, and also the widget control - or
  // 'options', to you and me.
  register_sidebar_widget('Widget Tutorial', 'widget_widgetTutorial');
  register_widget_control('Widget Tutorial', 'widgetTutorial_control');
}

add_action("plugins_loaded", "widgetTutorial_init");

That’s it. Disappointed? I hope not, because these few lines make the whole thing work. Let’s take a look at them in turn…

Initialise the widget

Here we have a simple funtion that we’ll call on the last line of the code. It really contains only two lines of php:

register_sidebar_widget('Widget Tutorial', 'widget_widgetTutorial');
register_widget_control('Widget Tutorial', 'widgetTutorial_control');

Again, we using calls to built-in WordPress functions here. The first, register_sidebar_widget(‘Widget Tutorial’, ‘widget_widgetTutorial’);, registers the widget for use on the site itself. It calls the widget ‘Widget Tutorial’ and we point it to the function we have written called ‘widget_widgetTutorial’. No more to it than that.

The second, register_widget_control(‘Widget Tutorial’, ‘widgetTutorial_control’);, is the WordPress function for the Dashboard, and tells the Widgets page where to look for our options. Again, we name the widget ‘Widget Tutorial’, and this time point towards our options function ‘widgetTutorial_control’.

You can change the name to whatever you want, and make sure it points to the right function (whatever you have called it).

And finally, after that final function, we register the widget with:

add_action("plugins_loaded", "widgetTutorial_init");

Again, pretty simple WordPress stuff here. We add an action so that when all the plugins are loaded we run the WidgetTutorial_init function – which we’ve just written.

And that, ladies and gentlemen, is that.

Next, we get more complicated and put together a Widget which displays, amongst other things, Flickr photos. But you’ll have to wait for that as this site needs a bit of an overhaul.

As ever, if you have any questions please drop me a line. You can also download the complete code and play with it.

Ranger, out.

The Complete Code

http://www.richardshepherd.com
Description: Simple Widget Tutorial from richardshepherd.com
Author: Richard Shepherd
Version: v1.0
Author URI: http://www.richardshepherd.com
*/

function widget_widgetTutorial($args) {
 // First we grab the WordPress theme args, which we
 // use to display the widget
 extract($args);

 // Now we sniff around to see if there are
 // any preset options
 $options = get_option("widget_widgetTutorial");

 // If no options have been set, we need to set them
 if (!is_array( $options )) {
  $options = array(
    'title' => 'Widget Title',
    'text' => 'Widget Text'
    );
 }

 // Display the widget!
 echo $before_widget;
 echo $before_title;
  echo $options['title'];
 echo $after_title;
  //Our Widget Content
    echo $options['text'];
 echo $after_widget;
}

function widgetTutorial_control() {

 // We need to grab any preset options
 $options = get_option("widget_widgetTutorial");

 // No options? No problem! We set them here.
 if (!is_array( $options )) {
  $options = array(
    'title' => 'Widget Title',
    'text' => 'Widget Text'
  );
 }

 // Is the user has set the options and clicked save,
 // Then we grab them using the $_POST function.
 if ($_POST['widgetTutorial-Submit']) {
  $options['title'] =
    htmlspecialchars($_POST['widgetTutorial-WidgetTitle']);
  $options['text'] =
    htmlspecialchars($_POST['widgetTutorial-WidgetText']);
  // And we also update the options in the WordPress Database
  update_option("widget_widgetTutorial", $options);
 }

?>

Widget Title:


 Widget Text:
<?php echo $options['text'];?>