?
Solved

wp_list_categories and pages

Posted on 2010-11-15
7
Medium Priority
?
1,118 Views
Last Modified: 2012-05-10
In a WordPress website with 20 categories, how can I adjust the following PHP so that it shows 10 categories in one column, and 10 categories in another?

So,

01: "Category"
02: --> "Sub-Category"
03: -->--> "Sub-Category"
04: -->--> "Sub-Category"
05: --> "Sub-Category"
06: -->--> "Sub-Category"
07: --> "Sub-Category"
08: -->--> "Sub-Category"
09: "Category"
10: --> "Sub-Category"

-------------- SPLIT --------------

11: -->--> "Sub-Category"
12: --> "Sub-Category"
13: -->--> "Sub-Category"
14: -->--> "Sub-Category"
15: --> "Sub-Category"
16: -->--> "Sub-Category"
17: --> "Sub-Category"
18: -->--> "Sub-Category"
19: "Category"
20: --> "Sub-Category"
echo '<div class="column-1"><ul>';

// Generate results for category header.
$term = get_term_by('slug', $_GET['cat'], 'category');
if (isset($term) && isset($term->term_id)) {
	wp_list_categories(array(
			'child_of'			=> $term->term_id,
			'title_li'			=> $term->name . ' Category',
			'depth'				=> 2,
			'taxonomy'			=> 'category',
			'number'			=> 10
		));
}

echo '</ul></div>';


echo '<div class="column-2"><ul>';

// ???

echo '</ul></div>';

Open in new window

0
Comment
Question by:numberkruncher
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 34142346
Start by using var_dump() to print out the return from wp_list_categories()  Once you understand what is in there, you may find the solution immediately.  It looks like you might want tabular data with the first row holding element[0] followed by element[10], the next row holding element[1] followed by element[11], etc.
0
 
LVL 13

Author Comment

by:numberkruncher
ID: 34143728
'wp_list_categories' returns HTML markup which is essentially nested lists. After 10 items (lists or sub-lists) I need to split it into 2 columns.

I understand that it is possible to specify a 'walker' class which can render custom output, but I cannot find any documentation for the walker class interface...
0
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 34145251
Can you please post the output from wp_list_categories?  I may be able to help you turn it into the columns, but I would only be guessing until I see the data it returns.  Thanks.
0
WordPress Tutorial 1: Installation & Setup

WordPress is a very popular option for running your web site and can be used to get your content online quickly for the world to see. This guide will walk you through installing the WordPress server software and the initial setup process.

 
LVL 13

Author Comment

by:numberkruncher
ID: 34151372
I have thrown together a quick test list to provide an example output as we haven't yet decided on our actual categories. I have removed unnecessary attribute values to make it cleaner.

I have also shown the multi-column markup that my client requires:
Output:
-------

<ul>
   <li class="...">
      <a href="..." title="...">Event</a>
      <ul class="children">
         <li class="...">
            <a href="..." title="...">Competition</a>
         </li>
         <li class="...">
            <a href="..." title="...">Performance</a>
         </li>
         <li class="...">
            <a href="..." title="...">Sport</a>
            <ul class="children">
               <li class="...">
                  <a href="..." title="...">Football</a>
               </li>
               <li class="...">
                  <a href="..." title="...">Cricket</a>
               </li>
               <li class="...">
                  <a href="..." title="...">Tennis</a>
               </li>
               <li class="...">
                  <a href="..." title="...">Hockey</a>
               </li>
            </ul>
         </li>
      </ul>
   </li>
   <li class="...">
      <a href="..." title="...">Colour</a>
      <ul class="children">
         <li class="...">
            <a href="..." title="...">Red</a>
         </li>
         <li class="...">
            <a href="..." title="...">Green</a>
         </li>
         <li class="...">
            <a href="..." title="...">Blue</a>
         </li>
         <li class="...">
            <a href="..." title="...">Yellow</a>
         </li>
         <li class="...">
            <a href="..." title="...">Black</a>
         </li>
      </ul>
   </li>
</ul>


Required Output:
----------------

<div class="column-1">
	<ul>
	   <li class="...">
		  <a href="..." title="...">Event</a>
		  <ul class="children">
			 <li class="...">
				<a href="..." title="...">Competition</a>
			 </li>
			 <li class="...">
				<a href="..." title="...">Performance</a>
			 </li>
			 <li class="...">
				<a href="..." title="...">Sport</a>
				<ul class="children">
				   <li class="...">
					  <a href="..." title="...">Football</a>
				   </li>
				   <li class="...">
					  <a href="..." title="...">Cricket</a>
				   </li>
				   <li class="...">
					  <a href="..." title="...">Tennis</a>
				   </li>
				   <li class="...">
					  <a href="..." title="...">Hockey</a>
				   </li>
				</ul>
			 </li>
		  </ul>
	   </li>
	   <li class="...">
		  <a href="..." title="...">Colour</a>
		  <ul class="children">
			 <li class="...">
				<a href="..." title="...">Red</a>
			 </li>
		  </ul>
	   </li>
	</ul>
</div>

<!-- Notice, splits half way through children list... -->

<div class="column-2">
	<ul>
	   <li class="...">
		  <ul class="children">
			 <li class="...">
				<a href="..." title="...">Green</a>
			 </li>
			 <li class="...">
				<a href="..." title="...">Blue</a>
			 </li>
			 <li class="...">
				<a href="..." title="...">Yellow</a>
			 </li>
			 <li class="...">
				<a href="..." title="...">Black</a>
			 </li>
		  </ul>
	   </li>
	</ul>
</div>

Open in new window

0
 
LVL 13

Accepted Solution

by:
numberkruncher earned 0 total points
ID: 34151574
I have found another way to achieve this...'get_categories', probably not the most efficient solution, but it works!
$column_count = 1;
$render_count = 0;

function render_cats($parent_id, $depth = 1) {
	global $column_count;
	global $render_count;

	$cats = get_categories(array(
			'child_of'			=> $parent_id,
			'taxonomy'			=> 'category'
		));
	$cat_count = count($cats);

	if ($cat_count > 0) {
		echo ($depth === 1) ? '<ul>' : '<ul class="children">';
		for ($i = 0; $i < $cat_count; ++$i) {
			// Begin a new column?
			if ($render_count++ >= 10) {
				// Close current list.
				for ($j = 0; $j < $depth; ++$j)
					echo '</li></ul>';
				echo '</ul></div>';
				if (++$column_count === 2)
					echo '<div class="column-2"><ul>';
				else
					return false;
			}

			// Output category item.
			$cat = $cats[$i];
			echo '<li><a href="', get_category_link($cat->cat_ID), '">', $cat->cat_name, '</a>';
			$done = render_cats($cat->cat_ID, $depth + 1);
			echo '</li>';

			if ($done)
				break;
		}
		echo '</ul>';
	}

	return true;
}

echo '<div class="column-1">';

$term = get_term_by('slug', $_GET['cat'], 'category');
if (isset($term) && isset($term->term_id)) {
	echo '<ul><li>', $term->name, ' Category';
	render_cats($term->term_id);
	echo '</li></ul>';
}

echo '</div>';

if ($column_count === 1)
	echo '<div class="column-2"></div>';

Open in new window

0
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 34151707
Efficiency does not matter with small algorithms that make no data base calls.  Accept your own solution if it works for you!
0
 
LVL 13

Author Closing Comment

by:numberkruncher
ID: 34182531
Thanks for your help anyway Ray, it is greatly appreciated.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The purpose of this video is to demonstrate how to add AdSense Ads to a WordPress Website, and how to set up WordPress to automatically place Ads in Sidebars. This will be demonstrated using a Windows 8 PC. Log into your AdSense account. : Cli…
The purpose of this video is to demonstrate how to set up an RSS Feed on a WordPress Website. This will be demonstrated using a Windows 8 PC. Feedburner will be used for this demonstration. Go to your WordPress login page. This will look like the…
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question