How To Display Two Columns For Categories In WordPress
Posted by Nile | Posted in Tutorials | Posted on 03-29-2010 | 2 Comments
Tags: categories, wordpress tricks
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.
<?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.
Related posts:









Twitter Comment
#wp #wordpress: How To Display Two Column For Categories In WordPress [link to post]
– Posted using Chat Catcher
Is there any way to display them similiar to DDMultiColCats? It auto-breaks the categories into two – and it worked with my last theme, but not this new one, so I'm looking for something new.
My recent post Vampire Knight- Episode 13 English Dubbed