Understanding the Wordpress Sidebar

The sidebar is a very important part of your blog. It appears on every page of your blog and is usually the main method visitors use to navigate around your blog.

The sidebar code may seem quite daunting at first but when you take the time to break it down, its very easy to understand. I hope this guide will help you understand the sidebar more and will help you modify it to your needs.

A look at the basic code of the Sidebar

Some themes use a different method however most themes (including the default theme of wordpress), the code looks something like this.


<div id="sidebar">
<ul>

</ul>
</div>


The above code is defined in the stylesheet using the id ’sidebar’. You can customise how the sidebar looks by modifying the sidebar section in the stylesheet.

The above is a short example of how the code works. ‘Name of Block’ is simply the title of the section ie. pages, categories, blogroll etc. It’s simply the name of the section or category. The links are then displayed undneath the title.

As you can see from the code above, the basic code of the sidebar is very simple when you break it down. To add in more sections you would simply add more blocks. In effect, the whole sidebar is just a list listed inside another list.

The traditional sidebar is just an extension of the basic code i showed above. Here is an example of a sidebar which displays the most common additions to the sidebar. Namely the Pages, Archives, Categories, Blogroll and the Meta sections.

<div id="sidebar">
<ul>

</ul>
</div>


A different way of listing Blocks

If you specify paramaters, you can list the most common sidebar sections a little differently. Lets use the category section as an example. The php code to list the categories of your blog is wp_list_categories(); however if you use wp_list_categories('title_li=<h2>Categories</h2>'); you can pass through the title of the block in the function call.

You see, the standard functions for the sidebar have the list code already so you can replace


<li><h2>Categories</h2>
<ul><?php wp_list_categories(); ?>
</ul>
</li>


with

<?php wp_list_categories('title_li=<h2>Categories</h2>'); ?>


More Parameters

The above example works because the parameter title_li was defined in the function. There are a variety of parameters you can use with your sidebar functions to display the information you want.

I’ve already showed you how the title_li can be used. Here are a few more parameters which you can add to your sidebar. Note:

• all you need to do to pass more than one parameter in a function is seperate different parameters with an ampersand eg &.
• This isn’t a complete list, merely 2 or 3 which i thought readers would be likely to use. For a complete list of parameters for all functions please refer to the wordpress docs.

show_count

This probably the most common parameter that is added to the sidebar. The showcount parameter allows you to display the number of articles in your categories and archives. Blogging Tips uses this to show how many posts we have in each section.

So

<?php wp_list_categories(); ?>


becomes

<?php wp_list_categories('show_count=1'); ?>


type

This parameter can be used in the Archives call (amongst other things). So type=monthly for example would list archives per month (this is probably the most common timeline used). It should also be noted that monthly is the default parameter used.

The others are

• monthly (Default)
• daily
• weekly
• postbypost

The first three are pretty straight forward. To display the post count in a weekly basis you would use

<?php wp_get_archives('type=weekly&show_post_count=1'); ?>


The last one in the list is ‘postpost’. This is used to display your latest posts(I use it on Blogging Tips). The code i use to display the 10 latest posts is


<?php wp_get_archives('type=postbypost&limit=10'); ?>


The limit parameter above simply defines how many posts to list.

Overview

The wordpress sidebar is pretty straight forward once you see how the nested lists work. There is a lot more parameters which i haven’t covered however in this post i just wanted to help give a basic understanding of how the sidebar works. If there is something you want to display in your sidebar and you don’t know how please leave a comment here or post a thread in the forums and i’ll do my best to help. I can cover more advanced sidebar topics in the future if there is enough demand for it

Good luck,
Kevin