Orangescale Studio

You're here: Home » Blog » Multiple sidebars in WordPress Widgets

Multiple sidebars in WordPress Widgets

by Thomas Arie Setiawan — June 28, 2006

I do not use WordPress to build my personal site, but Lala does. By default, there is only one "Sidebar". But what if we want to have more than one sidebar?

I asked Google. There are some discussions, tips, and tutorials I found. Based on those information, let's rewrite them.

WordPress Widgets plugin's manual says:

Instead of register_sidebar() you should use register_sidebars(n) where n is the number of sidebars. Then place the appropriate number in the dynamic_sidebar() function, starting with 1.

My first WP Widget friendly theme is Laila 2.0. Yes, it is widget-friendly theme. And I am working on the three-column layout version, with multiple widgets.

In my Laila theme, I have these lines of code in functions.php (inside theme folder) (Note: I do not use the WordPress default HTML structure, do not get confused):

if ( function_exists('register_sidebar') )
register_sidebar(array(
'before_widget' => '<div id="%1$s" class="side-c %2$s">', // Removes <li>
'after_widget' => '</div>', // Removes </li>
'before_title' => '<h3>', // Replaces <h2>
'after_title' => '</h3>', // Replaces </h2>
));

Using the code above, I have one sidebar, called "Sidebar 1". To produce the second sidebar, I modified the code:

if ( function_exists('register_sidebar') )
register_sidebar(array('name'=>'Sidebar 1',
'before_widget' => '<div id="%1$s" class="side-c %2$s">', // Removes <li>
'after_widget' => '</div>', // Removes </li>
'before_title' => '<h3>', // Replaces <h2>
'after_title' => '</h3>', // Replaces </h2>
));
register_sidebar(array('name'=>'Sidebar 2',
'before_widget' => '<div id="%1$s" class="side-c %2$s">', // Removes <li>
'after_widget' => '</div>', // Removes </li>
'before_title' => '<h3>', // Replaces <h2>
'after_title' => '</h3>', // Replaces </h2>
));

Now, there is "Sidebar 1" and "Sidebar 2" there. We can change the name, no problem. Next question: how to put in our theme?

We call "Sidebar 1" using this code:

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Sidebar 1') ) : ?>

That's it? Yes, that's it.