2 or 3 column categories in sidebar

As iridiax said. Try using two wp_list_categories with custom parameters. First with included categories 1,2,3,4,5 and second with 6,7,8,9,10. Ok…it’s not an automatic solution but it does what you want. Hmm i think I saw on some blog a plugin to make it automatic but really don’t remember where…hmm try this: http://www.dagondesign.com/articles/multi-column-category-list-plugin-for-wordpress/

this should work:

<?php
$cats = explode("",wp_list_categories('title_li=&echo=0&depth=0&style=none&hierarchical=1'));
$cat_n = count($cats) - 1;
for ($i=0;$i<$cat_n;$i++):
if ($i<$cat_n/2):
$cat_left = $cat_left.'<li>'.$cats[$i].'</li>';
elseif ($i>=$cat_n/2):
$cat_right = $cat_right.'<li>'.$cats[$i].'</li>';
endif;
endfor;
?>
<ul class="left">
<?php echo $cat_left;?>
</ul>
<ul class="right">
<?php echo $cat_right;?>
</ul>

It will automatically split your categories in half

RE: btdoyle

I’ve been using that code, but trying to break it up into 4 columns. Anything greater than 2 columns doesn’t work properly.

<?php
				$cats = explode("<br />",wp_list_categories('title_li=&echo=0&depth=1&style=none'));
				$cat_n = count($cats) - 1;
				for ($i=0;$i<$cat_n;$i++):
				if ($i<$cat_n/4):
				$cat_one = $cat_one.'<li>'.$cats[$i].'</li>';
				elseif ($i>=$cat_n/4 && $i<($cat_n/4)*2):
				$cat_two = $cat_two.'<li>'.$cats[$i].'</li>';
				elseif ($i>=($cat_n/4)*2 && $i<($cat_n/4)*3):
				$cat_three = $cat_three.'<li>'.$cats[$i].'</li>';
				elseif ($i>=($cat_n/4)*3):
				$cat_four = $cat_four.'<li>'.$cats[$i].'</li>';
				endif;
				endfor;
			?>
			<ul class="clientsCol"><?php echo $cat_one;?></ul>
			<ul class="clientsCol"><?php echo $cat_two;?></ul>
            <ul class="clientsCol"><?php echo $cat_three;?></ul>
            <ul class="clientsCol"><?php echo $cat_four;?></ul>

@funkboybilly – what do you mean by not working properly? This heavily depends on the number of entries you have in your categories. For example if you have 10 categories on your blog, a split in 4 will output a first line with 3, a second line with 2, a third line with 3 and a forth line with 2 categories.

If you stick to keeping the WP generated elements you be able to control the list a bit more.

As long as you’re only showing top-level categories, without children, the following should work fine.. ( i imagine it will mess up with a hierarchal type display of cats )

<?php
$get_cats = wp_list_categories( 'echo=0&title_li=&depth=1&hide_empty=0' );
// Get cats 

$cat_array = explode('</li>',$get_cats);
// Split into array items

$columns = 4;
// How many columns (virtual)

$cats_shown = 0;
// Don't touch this, this is just a counter (used below)

echo '<ul style="display:inline;">';

foreach($cat_array as $category) {
	$cats_shown++;

	// The 2 lines below can be removed if you apply the style definitions to the classes (ie. cat-item, cat-item a etc..)
	// This was just quicker and easier for me to use whilst testing the code.
	$category = str_replace('<li','<li style="display:inline"',$category);
	$category = str_replace('<a href','<a style="width:160px;display:block;float:left" href',$category);

	if($cats_shown % $columns == 0) {
		// If the counter is a multiple of the columns to show
		print $category.'</li></ul><br /><ul style="display:inline;">';
	}
	else {
		// Else just a regular item
		print $category.'</li>';
	}
}
echo '</ul>';
?>

NOTE: I have used inline styling simply while i was testing. However since i’ve left WordPress to generate the list elements the classes to style the elements are available, so it can be totally done away with if you apply the style defs directly in your CSS instead.

display:inline is supported across browsers, but i’m not sure about widths of anchor(link) elements, so it may require a little tweaking..

Without CSS (inline or in the style.css) the code above will simply do..

[post]
[post]
[post]
[post]

[post]
[post]
[post]
[post]

The key here was setting each list to display inline, then they end up like this..

[post] [post] [post] [post] 

[post] [post] [post] [post]

In order to get a fixed width (which you need to make the list columns match each other) i applied the width to the link element.

At least this way you retain all the WordPress style classes etc…

Hope that helps…

Code above shows for 4 categories per row (so like 4 columns). There’s a variable, right near the top..

$columns = 4;
// How many columns (virtual)

Set to 3, and it’ll work for 3 columns.

[cat][cat][cat]
[cat][cat][cat]
[cat][cat][cat]
[cat][cat][cat]
[cat][cat][cat]

and so on, until it runs out of cats to list…

If you want 5 across, 3 down (opposite to above – 15 total), then set the variable to 5.

As long as you adjust the width set on the link elements to accomodate the room on the page then you can use any value you like there.