WordPress: Widgetised Sidebar

Widgets can be used in your WordPress theme, which is handy because you can edit your sidebar with ready-made widgets such as recent comments, recent posts, tag clouds, and other available widgets, with ease.

To be able to do this, you must make sure that your sidebar is widget-ready.

The following image shows what a widget for “recent posts” might look like:

recent post widget

As you can see, there is a title for the widget, then the widget itself (showing the posts – in this case there is just one post), and the entire widget is wrapped in a div.

Open up functions.php in your WordPress theme. If you don’t have one, create a new file called functions.php. Paste the following code into it.

<?php
	if ( function_exists('register_sidebar') )
		register_sidebar(array(
		'before_widget' => '<div class="box">',
		'after_widget' => '</div>',
		'before_title' => '<h2>',
		'after_title' => '</h2>',
	));
?>

You can edit the parts in bold. These are what the variables mean:
before_widget: What goes before the widget. Handy if you’re using a div to place the widget in.
after_widget: What goes after the widget; pretty self explanatory.
before_title: Use HTML for a heading here, if you want.
after_title: End the HTML tag you used.

You don’t have to fill in all these. Just remove what is between the apostrophes if you don’t want that customised.

Save functions.php and upload it to the folder which has your activated theme.

Open sidebar.php and place the following code into it, where you want the widgets to appear.

<?php
	if ( !function_exists('dynamic_sidebar')
	|| !dynamic_sidebar() ) : ?>
<?php endif; ?>

If you don’t have sidebar.php, just copy your sidebar content into a file of that name, and place <?php get_sidebar(); ?> where you want the sidebar.

Log into your WordPress admin, and go to Appearance then Widgets. All you have to do is drag the widgets you want to use into the “Sidebar 1″ which should appear on the right of the screen.

After dragging the widgets and customising them, click “Save”. You can also drag the widgets around to put them in the order you like. View your theme, and you should see your widgets in your sidebar or wherever you placed them.