How To Split Categories List into Columns in WordPress


The list of categories is displayed in the sidebar or on any part of the theme will be in a single column. But for people who have many categories, It will be better to Split into columns so that it may not take much. Here is the by which you can split your categories’ list evenly into two or more columns which can save space and not make your pages longer. Usually in WordPress, the following code is used to call the categories’ list (you can find it in one of the sidebar files like Sidebar.php)

<?php wp_list_categories(); ?>

 

Now, we will try and split the categories into two columns. Replace the above code with the following

 

<?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;
?>
<ul class="left">
<?php echo $cat_left;?>
</ul>
<ul class="right">
<?php echo $cat_right;?>
</ul>

 

Basically the above code will split your categories and put them into two lists (left and right). Now all you have to do is style them so that they float left of each other. Add this code to your style.css file

 

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

 

This will make the categories displayed evenly in 2 columns like this.

               split-categories

You can make any other adjustments you want according to your theme. Try it and do mention any other methods to improve the splitting of categories list.

Comments

Leave a Reply to Pavan Kumar