Helping You Rock Out Your Site Like A Rockstar!

Displaying two columns for categories in your WordPress is not too hard. Just takes a little php, html, and css. You can put this in your posts, pages, or sidebar.

We are taking the usual category code for WordPress.


<?php wp_list_categories(); ?>


and replacing it with the following code. This php splits up each category and into columns, much like splitting odds and evens. This code would go in your template where you want it displayed.


<?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/2):
$cat_left = $cat_left.'<li>'.$cats[$i].'';
elseif ($i>=$cat_n/2):
$cat_right = $cat_right.'<li>'.$cats[$i].'</li>';
endif;
endfor;
?>


After you have put the above code you are ready to add your HTML right after it. Remember you need to make sure to remember your css class definition, because you will be adding it to your theme’s stylesheet. Remember you can use your own definitions, but remember to make sure you are not already using them for another part of your theme.


<ul class="alignleft">
<?php echo $cat_left;?>
</ul>
<ul class="alignright">
<?php echo $cat_right;?>
</ul>


Now that you have the php and html done, you need to add your css. In the case of this tutorial, I have used alignleft and alignright for the classes.


.alignleft {
float: left;
}
.alignright {
float: right;
}


Of course, if you want to play with the css and do other things, by all means go ahead.