How to add Dynamic Widget Ready Sidebars in WordPress

Posted on October 16th, 2009 by in Themes | 16 Comments  
How to add Dynamic Widget Ready Sidebars in WordPress

There are times when you want to display widgets on other locations than your default sidebar. With such high demand for this hack, we will be sharing how you can create multiple dynamic sidebars that are widget ready for your WordPress blog. There are some plugins that will require you to use the widget only, or in some cases widget is what you feel comfortable with then this is the hack for you.

First you will need to visit your functions.php located within your theme folder.

For users using WordPress 2.8.1 and above, add the following code in:

register_sidebars(3);

For users using below WordPress 2.8.1, we suggest that you upgrade. We will not be sharing a way to do this below that version.

By adding the code above, you told WordPress to add 3 additional sidebar for your widget section, so now in total you will have 4 sidebars.

In your WP-Admin area go to Appearance » Widgets and you should see something like this:

How to Add Dynamic Widget Ready Sidebars in WordPress

Choose the widgets of your choice and place them in the sidebars that you like to display these in. Now some of these sidebars can be displayed in the footer or anywhere else you like.

Once you have done adding the widgets to each sidebar, simply open up a theme file of your choice and paste the following code to display each sidebar.

<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(2) ) : else : ?>
Insert text that will display only if you are not using any WordPress widgets in this sidebar.
<?php endif; ?>

Simply change the number 2 to the appropriate number. If you leave it blank, it will assume that the number is 1 and therefore display Sidebar 1.

By using this hack, you can accomplish results like we have in our footer:

How to Add Dynamic Widget Ready Sidebars in WordPress

This hack is very versatile and can come in handy in many cases, so save it, bookmark it, and share it with those who need it.

About

Editorial Staff at WPBeginner mainly Syed and David.

Post comment as twitter logo facebook logo
Sort: Newest | Oldest

awesome hack +now what widget would be best for the footer.

and what about css? please tell me code for css with everything set. SO that I only have to change the values.

Where would this go in the functions.php ?

register_sidebars(3);

It can go anywhere within the php codes. At the top would be just fine.

I added the - register_sidebars(3); - after the first registered sidebar that was already in my functions.php file and it gave me problems. Instead of giving me a 1 through 4 list it gave me sidebar 1 two times followed by sidebar 2 and 3. I ended up moving the register_sidebar(3); before the first registered sidebar and that fixed my issue.

Place the following code where?

Once you have done adding the widgets to each sidebar, simply open up a theme file of your choice and paste the following code to display each sidebar.

Insert text that will display only if you are not using any WordPress widgets in this sidebar.

You can place it wherever you like in your theme files. If you want to display these in the sidebar then put them in sidebar.php. If you want to use the widgets in the footer, use it in footer.php

I followed the steps on this tutorial however I am having a problem dragging the widgets to the sidebars I want them to go to, anyone know the reason why? using wordpress 2.9+

Help will be greatly appreciated

Thanks

Is it just the widgets? Try going to your write panel, and see if you can move things around. If you can't, then it is a JavaScript error that many users have faced. It is either being caused by one of the plugins that you have installed, or TinyMCE Script not functioning properly.

thanks for the reply,

I checked the writing panels and they didnt move either, I did go through the plugins and found out it was a plugin that was preventing me from making the changes. I deactivated and will now find a new plugin to replace the old one. it was an event calendar plugin.

Thanks again!

very very good
Thank so much, it give me some ideas for new theme

Nice but would make more sense to give any sidebar (or better: widgetarea) a unique name although that requires a little mor code in the functions file. But it also adds more flexibility in terms of formating.

//Widgetized sidebar with unique name
if ( function_exists('register_sidebar') )
register_sidebar(array('name'=>'Sidebar Name',
'before_widget' => '',
'after_widget' => '',
'before_title' => '',
'after_title' => '',
));

Cheers
Michael

Yeah that code might complicate some users, that is why we didn't provide it. It comes built-in with the default WordPress theme, and it is certainly a better code, but to keep it very simple, we used the other one.

survey728 5 pts

I've installed this sidebar in my footer but the widgets are stacking on top of one another instead of side by side at officialbabyshowerguide.com. Is there css I should be adding to the stylesheet for this?

wpbeginner 50 pts moderator

survey728 Yes, you need to add css classes. First idea would be to wrap it all in an id like #footer-widgets...Then add a class like #footer-widgets .widget{width: 100px; float: left;} Replace the width to whatever you like. Add margins and such to your like.

Tweets about us: