How to Create Multiple Dynamic Sidebars for WordPress Widgets

By 27-11-2007   BloggingTutorialsWordPress

In the last tutorial, you learnt how to widgetize your wordpress theme to support wordpress widgets. Now this tutorial explains how to create multiple dynamic sidebars to add various combinations of widgets to customize your wordpress theme even more.

I suggest you read how to Widget-Enable WordPress Themes in 3 Easy Steps before reading further as examples will be quoted in the same context.

Edit Functions.php for Multiple Dynamic Sidebars

The functions.php code which helped to widgetize your wordpress theme and support a single dynamic sidebar, now needs to be edited (using any text editor like Notepad) to support multiple sidebars. You remember we had modified the default function.php from

<?php
if ( function_exists('register_sidebar') )
register_sidebar();
?>

to the new code below to support our customized template with h4 subtitles and non-default unordered lists in the sidebar. REMEMBER you need to edit functions.php to match your wordpress theme or it will not work.

<?php
if ( function_exists('register_sidebar') )
register_sidebar(array(
'before_widget' => '',
'after_widget' => '',
'before_title' => '<h4>',
'after_title' => '</h4>',
));
?>

To support multiple sidebars, I simply need to specify that multiple sidebars be used and name them as I like. In our case I use Sidebar1, Sidebar2 etc and as many as you like. The code now looks like this –

<?php
if ( function_exists('register_sidebar') )
register_sidebar(array('name'=>'sidebar1',
'before_widget' => '',
'after_widget' => '',
'before_title' => '<h4>',
'after_title' => '</h4>',
));
register_sidebar(array('name'=>'sidebar2',
'before_widget' => '',
'after_widget' => '',
'before_title' => '<h4>',
'after_title' => '</h4>',
));
?>

I personally have extended this capacity to 6 dynamic sidebars on this blog. Here is how it looks like on top of admin panel.

4 Dynamic Widget Sidebars
Now you can drag and drop widgets of your choice to different sidebars and customize the options. Remember to Save Changes or else all customization is lost.

Add Dynamic Sidebars to WordPress Template

Now you need to place the code in the wordpress theme template where you want the relevant wordpress widgets to work. Instead of the previous code, you can place the different dynamic sidebars in different areas of the template.

Sidebar1 code goes like this

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

Sidebar2 code goes like this

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

Save the template and watch your widgets go live. You can add lots of dynamic sidebars with various widget combinations and have truly unique web design concept.

77 comments on “How to Create Multiple Dynamic Sidebars for WordPress Widgets

  1. Hannit says:

    Very clear article.

    In order to make this really usable I’d add the following plugin: http://www.lancelhoff.com/2007/08/29/wordpress-duplicate-sidebar-widgets/

    This plugin lets you duplicate existing widgets so you can use more then one instance of them. Can be very useful in case you want to have some common functionality on the sidebars.

  2. David Stembridge says:

    On my template, the call for sidebar is:

    I registered a new sidebar successfully; but when I add the call for new sidebar as you suggested…

    I get a oddly formated page.
    I am adding the code to a very slightly modified page template. Any ideas, or clues?
    Thanks!

  3. David Stembridge says:

    OK… I modified the base page, rather than a tweaked page, and that works. The formating seems a little off though, from the main page I’m working on:
    http://www.fbcwaynesboro.org/wp
    I have been tweaking on a second WP install here:
    http://www.fbcwaynesboro.org/wp2
    Going back and forth, the heading for the new sidebars doesn’t look the same. Is that because I’m using the h4 subtitles? Why are you suggesting the header change?
    Thanks again!

  4. QuickOnlineTips says:

    David – it is indeed a h2 vs h4 issue. Customize it as per your own site CSS.

  5. Rafael Dourado says:

    Nice article! Just to complement what you said… The function dynamic_sidebar accept numbers too, like 1 for the first sidebar and 2 for the second. I prefer using numbers, because sometimes I change the sidebar name for some users understand it.

  6. Jason Kelley says:

    I added 7 new sidebars to functions.php file within my current theme but do not see any additional sidebars in the wordpress admin. Any thoughts…

  7. QuickOnlineTips says:

    Check under the widgets tab. Remember to name them differently.

  8. David Glendinning says:

    Have added an additional sidebar called sidebar2 to the functions.php file and can see it OK in the widgets admin. However I am having a problem getting the new sidebar to execute. What is the correct format for to get ‘sidebar2’ to execute in the template.

  9. Sounds Good says:

    Thank you!! Simply, clean, great post!

  10. Rajeef says:

    Can you explain one thing — how do you make your page call your new sidebars? I mean, I would like to call my second sidebar as the “right column”.

    Do I have to edit my template pages?

    Thanks!

    Raj

Leave a Reply

Your email address will not be published. Required fields are marked *

*