How to Create Multiple Widgetized Sidebars in WordPress

Sometimes a client’s WordPress website requires different sidebars for each page. There are multiple ways to do this, but most are sloppy and require the client to remember too many steps. This method requires only changing 2 files, a little PHP and is much easier to use for the client. This assumes you are including

<?php get_sidebar(); ?>

in your template pages.

To keep it simple we will assume that we only have 3 pages on the website. A home page, about page and contact page.

First of all, open up your sidebar.php file. It should look something like this.

			<?php 	/* Widgetized sidebar, if you have the plugin installed. */
					if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
			<?php endif; ?>

Change it to this.

			<?php 	
			
			/* Widgetized sidebar*/
			if ( is_page(array('home') ) ){
				if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_home') ) : endif; 
				
			}elseif ( is_page('about') ){
				if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_about') ) : endif; 
				
			}elseif ( is_page('contact') ){
				if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_contact') ) : endif;  
						
			}else{
				if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : endif; 
				
			}
			
			?>
         

Let’s walk through this. The first statement reads, if the page is “home” then use sidebar_home. The second and third statements refer to the “about” page and the contact “page” respectively. The last line states that if the page is not any of these then display the default sidebar.

The second file we need to change is the functions page. It may look something like this.

<?php
if ( function_exists('register_sidebar') )
    register_sidebar(array(
        'before_widget' => '<li id="%1$s" class="widget %2$s">',
        'after_widget' => '</li>',
		'before_title' => '<h2 class="widgettitle">',
        'after_title' => '</h2>',
    ));

Change it to this:

<?php
if ( function_exists('register_sidebar') )
    register_sidebar(array(
        'before_widget' => '<li id="%1$s" class="widget %2$s">',
        'after_widget' => '</li>',
		'before_title' => '<h2 class="widgettitle">',
        'after_title' => '</h2>',
    ));
    
    register_sidebar(array('name'=>'sidebar_home'
    ));
       
    register_sidebar(array('name'=>'sidebar_about'
    ));
           
    register_sidebar(array('name'=>'sidebar_contact'
    ));

The above code is telling WordPress the sidebars we want to use.

Here is how it should look in the admin panel, except without so many sidebars. this is a screenshot of a client’s admin area.
sidebar_screenshot

Now all the client needs to do is drag and drop widgets into whatever page they desire.

My next post will be on how to add to this code, so you can display sidebars for different categories and archives.

Share and Enjoy:
  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • Add to favorites
About Jeffrey Horen

I am the owner of Excelnet Media. We are a full service, one stop interactive web agency building extraordinary websites with extraordinary customer service for extraordinary clients.

Speak Your Mind

*