How to Display WordPress Categories in two Columns

WordPress categories are helpful in listing the posts and are useful to some extent in terms of SEO. Every WordPress category will have an unique name and slug URL, here are some categories from WPSquare for your reference:

WordPress Themes – http://www.wpsquare.com/category/themes
WordPress Plugins – http://www.wpsquare.com/category/plugins
WordPress Snippets – http://www.wpsquare.com/category/snippets

Now, coming to our topic, all the categories in your blog can be listed using the default Category list plugin in WordPress. But, coming to displaying those categories in two columns (mainly to save some real-estate on your blog homepage) there are no widgets or plugins. Simply use this code snippet and also follow instructions on How to Execute php in WordPress Text Widget without a Plugin, so that you can list categories in two columns using a text widget.

Display WordPress Categories in two Columns

You can add this code to sidebar widget or can add to any hook of your theme (if you are using Thesis or Genesis framework).

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

Functionality of the code:

• This code mainly depends on wp_list_categories function.
• It will check for all categories in your blog and simply list them in two columns.

Also Check: How to Display Random Posts in WordPress without a Plugin

Style WordPress Categories in two Columns

You need to edit these theme files…

style.css

Hence, it is recommended to backup your theme.

Now, its time to add some styling to the category list, hence add below code to style.css file and click on update button.

#categories .left {
float: left;
width: 49%;
margin:0 5px 0 0;
}
#categories .right {
float: left;
width: 49%;
}

You have successfully added WordPress Categories in two columns, if you got any query regarding this article please do drop a comment.