| 27/11/2007 |
|
|
 |
|
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.
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.
| Like this article? |
|
Write a guest article - Get free links, SEO, traffic, readers for your site. 250+ guest bloggers cant be wrong! Join the team.
RSS
Twitter
Facebook
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.
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!
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!
David – it is indeed a h2 vs h4 issue. Customize it as per your own site CSS.
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.
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…
Check under the widgets tab. Remember to name them differently.
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.
Thank you!! Simply, clean, great post!
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
The dynamic sidebar template codes have to be inserted into the sidebar.php in your blog template. Otherwise how will it know where the code has to be executed. :-)
Great tutorial, thanks, I was looking for something like this !
As an amateur PHP programmer struggling to get my own site developed, I found this article to be of great assistance. Without this I would still have been struggling to figure this lot out. Thanks.
Hi!
I found this article to be incredibly helpful, however, I’m having trouble with the headers in my second sidebar (which is actually at the very bottom of the page). You can see the “Calendar” but the title does not style with the like it should. The titles in the right sidebar are correct. I’m using for the titles and I’ve confirmed that my functions.php calls for . Can you assist?
Thanks!
I have got my dynamic sidebars widgetized in no time. Thanks alot! :)
Some people use a hierarchy method in the naming of the template files to achieve multiple WordPress sidebars, but in my opinion it is too cumbersome for most user’s needs. The method of multiple sidebars for WordPress that I use involves only a very simple PHP snippet added to the template to call the desired sidebar file depending on the area of the site that you are in.
Thank you so much! I just have 2 sidebars now. But… I still need the ‘very simple PHP snippet… to call the desired sidebar file depending on the area of the site’.
I would like to see different sidebars on different pages. Any PHP snippet available?
You can easily different sidebars on pages, single posts, index pages, archives, categories, etc.
Many thanks for this article– I went from scratching my head to 10 sidebars in 20 minutes.
Thanx, great post
Howdy-
You should probably put both calls to register_sidebar within your if statement:
‘mid_column’,
‘before_widget’ => ”,
‘after_widget’ => ”,
‘before_title’ => ”,
‘after_title’ => ”
));
register_sidebar(array(
‘name’=>’right_column’,
‘before_widget’ => ”,
‘after_widget’ => ”,
‘before_title’ => ”,
‘after_title’ => ”
));
}
?>
Otherwise the function will bomb if register_sidebar doesn’t exist for any reason. If you’re not worried about this, then omit the “if” statement altogether. However, just wrapping it around one call won’t help.
Thanks for the post!
Thank you so much for saving my day! :D
Thanks for sharing this! My php knowledge is rudimentary, and this was a huge help. You saved me much time trying to figure out the problem with my template’s sidebars. I did run into an error updating this through the theme editor. Had to do it offline and ftp the files back up. Worked wonderfully.
I was searching like this. Mia said ” you saved her day” I agree Mia
Thank you very much for this! Many hours saved and the wife will appreciate that. I am now looking for a way to call one of my 10 sidebars dynamically inside the wp admin without having to change my code in my template per page. whooo…that was a long sentence.
If you have any tips in this area, I would love to hear about it.
~ Chais Meyer
Another great article. CHEERS..! Just what i was looking for. And believe it took only 5 minutes to do this task. Really thanks…
Thank you for this post. It helped me to save a lot of time. I was looking for the way to duplicate existing sidebars and finally found useful piece of information only here.
Cool, it works perfect !! Thank you very much for your work ! But, wordpress is putting automaticly to the right side, to the other sidebar, and i wanted it to the left side of my site, how can i do this ? Thank you !
I found this page by googling.
Thanks for posting this tips!
As I learn more I will always remember that I started here. Thank you for all the info I can put it to use in my business plan.
Thank you so mutch I have tried every so called webmasters code and nothing worked, Why can’t anybody keap things simple like you! And show you what you need to do… 5 Stars
For each instance of sidebars that I have added, how would I go about defining which category IDs to include/exclude from each instance? I had originally defined the global exclusion IDs in the default-widget.php file prior to adding additional sidebar instances, but now I want to defeat that and include/exclude on specific instances of sidebars 1,2,3, etc. – thx – weevie833
I use your tutorial. That is great but I would ask you how make it. Here below what I want
Over Dhini :
- Beauty
- Chickmeida
- Special
- more
But on my sidebar over Dhini show also Site (this I dont want it)
Thank you
Keep working, great job, I love it!
Thanks for tip! Because you took the time to put this online I’m a step closer to giving my blog the pro look I want it to have
THANK YOU! fantastic – helped me out loads… Still got something kooking out but this was awesome, thanks so much.
Thanks! You saved me countless hours by posting these tips!
Great stuff man, this just open a hole new world of dynamic sidebars on my personal blog. Is there any way to show a different sidebars with certain posts,
Your directions were easy to follow, but I am not getting the proper result. I am using the iBlog2 template which seems to draw info from the sidebar.php file before reading the template file. I was able to successfully edit the functions.php and then add a sidebar2 the the php page, (so two widgetitized sidebars display one on top of the other) but I cannot figure out how to have the theme template dictate the sidebar. this may be a drawback of the theme, but I could sure use some help if anyone has ideas.
seth
I figured it out. The get Sidebar was in the footer.php file. I had to created customized footer and sidebar phps, but now it is looking goof.
Thank you for this easy tutorial! Beginner will surely appreciate this!
Thank you so much. This totally worked for me!
Great tutorial. Very clear and helpfull. Thanks!
After some searching I have found your post and you seem authoritative and clear to me and I hope you have a sec to point me in the right direction.
I just moved our site to a new host and on getting things back up one of my sidebar elements had disappeared.
I went to the widgets panel (wordpress 2.7.1) and created a new wysiwyg text widget in the same sidebar1 and placed my content into it. But everything is now transparent over the background image, it seems that firebug is telling me that it has no style at all.
What’s going on? I included the #wysiwig-13 element in the css, but the background color doesn’t seem to want to stick to this panel (Free Orientation).
Do I need to let someone else know that this panel has been added?
Thanks for any wisdom on this.
rama dev
Excellent! Thanks very much!
It’s not working 100% for now but I’m getting there!
Cheers
Hello! I’ve just added the code you mentioned above and in the admin panel everything works fine.
But i have some problem with the code of the single.php: the portion “” doesn’t appear in the code of a single post.
Can you tell me why?
Great, working! thanks.
Hi,
I added the code. I have the second sidebar in my admin. I added one widget to check, so when I preview my site the sidebar appears and then disappear how come?
Thanks
OKY, I played around with the codes. I was able to get both sidebars up, but sidbar2 which is apart of the About Me page widgets are at the bottom of page. Any advice
Niema if the widgets are showing up at the bottom of the page it might be that you have CSS issues since its a 2nd sidebar
it works thanks………
Great stuff buddy! I found what I was looking for, thanks.