Solved

wp_list_categories and pages

Posted on 2010-11-15
7
1,083 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
  • 4
  • 3
7 Comments
 
LVL 108

Expert Comment

by:Ray Paseur
Comment Utility
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
Comment Utility
'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 108

Expert Comment

by:Ray Paseur
Comment Utility
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
What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 
LVL 13

Author Comment

by:numberkruncher
Comment Utility
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
Comment Utility
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 108

Expert Comment

by:Ray Paseur
Comment Utility
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
Comment Utility
Thanks for your help anyway Ray, it is greatly appreciated.
0

Featured Post

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

In order to have all security and back ups taken care of, WordPress users can sign up for services with WP Engine.
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.
The purpose of this video is to demonstrate how to Test the speed of a WordPress Website. Site Speed is an important metric of a site’s health. Slow site speed can result in viewers leaving your site quickly and not seeing your content. This…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

728 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

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now