WordPress: How to check widgets in dynamic sidebar

There are times when you need multiple dynamic sidebar on your WordPress blog. Espeically when you are trying to customized your WordPress into something more powerful. Creating multiple dynamic sidebar is as simple as writing the following code.

$loop = array('SIDEBAR 1', 'SIDEBAR 2', 'SIDEBAR 3', 'SIDEBAR 4','SIDEBAR 5');
foreach($loop as $item){
if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar($item) )
	echo 'no dynamic sidebar';
}

With a sidebar registration logic in your theme functions.php such as below,

$loop = array('SIDEBAR 1', 'SIDEBAR 2', 'SIDEBAR 3', 'SIDEBAR 4','SIDEBAR 5');
foreach($loop as $item){
	register_sidebar( array(
		'name' => __( $item, 'example' ),
		'id' => $item,
		'description' => __( $item, 'example' ),
		'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
		'after_widget' => '</li>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );
}

Everything looks good. You could customized the tag and title before your widget and title. Not until you find yourself having to customized your dynamic sidear with a customized before and after tag.

Adding Before and After Tag On Dynamic Sidebar

Well, its not that hard, just add it as follow and you will get your before and after tag for your sidebar!

$loop = array('SIDEBAR 1', 'SIDEBAR 2', 'SIDEBAR 3', 'SIDEBAR 4','SIDEBAR 5');

foreach($loop as $item){
echo '<div class="'.$item.'">';
if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar($item) )
	echo 'no dynamic sidebar';
}
echo '</div>';

There! all our sidebars have its own wrapper! But i only want these wrapper if there are widget on it! erm...i guess i would need to check whether there is widget on it before i append the wrapper for each sidebar. How do i check whether a widget is used on a dynamic sidebar?

How to check widget is in used on a dynamic sidebar

The problem is simple, the solutions, you would have to dig a bit. The solutions that i managed to get my hand on was is_active_sidebar which tells us whether a particular sidebar contains a widget. Hence, we can perform our code as below,

$loop = array('SIDEBAR 1', 'SIDEBAR 2', 'SIDEBAR 3', 'SIDEBAR 4','SIDEBAR 5');
foreach($loop as $item){
if (is_active_sidebar($item) ){
	echo '<div class="'.$item.'">';
	dynamic_sidebar( $item ); 
	echo '</div>';
}

the above code will determine whether a particular sidebar is active (contain a widget), if it does contain a widget, we can add a wrapper before and after the dynamic sidebar and populate out the contain of this dynamic sidebar within the wrapper tag. For those which doesn't have any widget, we will simply ignore it.

is_active_sidebar doesn't work!

Well, it really doesn't work that is why there is an article from me. ha ha ha. It is actually a small bug in this particular function provided by WordPress. (can't bother to report so i write it out instead) If you look closely into the core code of is_active_sidebar, you will notice that if you pass it either lowercase or index number into this method, you will find that it works perfectly fine. However, if you pass in an uppercase as shown on my example, you will face this problem. The reason is that the method will sanitize the text you provide and this cause your string to go lowercase whereas the sidebar that you have registered was an uppercase. Therefore, it fail. What you have to do is either lowercase your sidebar names or create a logic that lowercase it for you.

Hope it helps someone out there 🙂