getButterfly Logo getButterfly code wrangling since 2005

I was doing some research the other day to minimize the space occupied by my single-worded categories, and I found a nice way to do it.

Add the following to your CSS stylesheet:

.right {float:left; width:160px;}
.left {float:left; width:160px;}

Add the following to your sidebar, making sure you respect the widget styles:

<div class=”widget_box”>
$cats = explode(‘<br />’, wp_list_categories(‘title_li=&echo=0&show_count=1&depth=1&style=none’));
$cat_n = count($cats) – 1;

$cat_left = $cat_left.'<li>’.$cats[$i].'</li>’;
$cat_right = $cat_right.'<li>’.$cats[$i].'</li>’;

<ul class=”left”>
<?php echo $cat_left;?>
<ul class=”right”>
<?php echo $cat_right;?>

That’s it! Test it and tell me how it works.

Subscribe to getButterfly Blog

Once a week or so we send an email with our best content. We never bug you, we just send you our latest piece of content.

If you found any value in this post, agree, disagree, or have anything to add - please do. I use comments as my #1 signal for what to write about. Read our comment policy before commenting! Comments such as "Thank you!", "Awesome!", "You're the man!" are either marked as spam or stripped from URL.

One thought on “How To Style WordPress Categories Into 2 Columns

Leave a reply

Love programming?

Learn about the most amazing things. Get smarter everyday!