Multiple columns with WP’s: wp_post_page()

[dellex]

Creating a multi-column list from WordPress’ default function (wp_post_page()) is a pain.
I was tasked to create a multi-column list and realized there wasn’t a simple argument to do so.
With that said, I have to create a code which should do the job…and it does the job so well… The entire code should be visible on the bottom part, however, allow me to explain what’s happening.
Normally, you’ll simply call WordPress’ wp_list_pages() function:

1. wp_list_pages(‘title_li=&echo=0&child_of=’.$post->ID));

…but that would display all the links, in one row, and if you’ve had a couple of links, you’d probably end up a very long page and you’ll actually want to place those links in column. Allow me to share this code below. Use it in replace of that simple wp_list_pages() call.

1. /////// Configure this part for the number of columns that you want /////////
2. $columns = 6; // number of columns you want
3. ////////////// End of Configuration ////////////////
4. $page_s = explode("
5. <ul>
6. <li>
7. <ul style="float: left;">
8. <li>
9. <ul>)
10. for ($x = 0 ; $x <= ($div_by); $x++) { // Loop through all the links upto it’s "divisibility"
11. echo $page_s[$x].”; // show the first columns of with "X" number of links
12. }
13. echo "</ul>
14. <ul style="margin-left: 20px; float: left;">‘; // Start building the column
15. $link_num = $i * $div_by; // Get the number of links this column from this column
16. $prev_link_num = $div_by * ($i-1); // Get the number of links from the previous column
17. /* List all the links, but limit them from the previous column’s total number of links and the number of links you ought to display which is once defined by "$div_by" */
18. for ($j = ($div_by+1); ( ($j < count($page_s)) &amp;&amp; ($j <=$link_num)) ; $j++) { if ($j > $prev_link_num) // We need to display the links that are not yet displayed
19. echo $page_s[$j].”; // List all the links for this column
20. }
21. echo "</ul>
22. </li>
23. "; // Start making the first column (
24. "; // end of the first column
25. }
26. else { // For the second column and further
27. echo ‘
28. "; // end of the column
29. }
30. }</ul>
31. </li>
32. ",wp_list_pages(‘title_li=&amp;echo=0&amp;child_of =’.$post->ID)); // Get the number of links that we need to generate
33. $div_by = (int) (count($page_s) / $columns); // …divisible by
34. for ($i = 1 ; $i <= $columns ; $i++) { // Loop through the desired number of columns
35. if ($i == 1) { // If it’s the first column
36. echo "</ul>

If you want to adjust the number of columns it would display, just change this line:

1. $columns = 6; // number of columns you want

Hope that helps.