Ask your WordPress questions! Pay money and get answers fast! (more info)

List categories in heirarchy with descriptions

  • SOLVED

Check out this page... (disregard the font formatting)
[[LINK href="http://www.perthmetro.net/asdan/modules/"]]http://www.perthmetro.net/asdan/modules/[[/LINK]]
I'm looking to do the same as this but with each category's description suffixed to the cat name.

I'd like the description to have the ability to be styled with css.

Answers (2)

2013-09-09

Arnav Joy answers:

try this
< ?php $categories = get_categories('child_of=1&style=list&depth=1&title_li=');

foreach ($categories as $cat) {

echo "
".$cat->cat_name."
".$cat->category_description."
";

} ?>


pjeaje comments:

<blockquote>I'd like the description to have the ability to be styled with css</blockquote>


Arnav Joy comments:

check this link also

http://www.wplover.com/1016/category-based-navigation-with-description-a-la-grid-focus/


Arnav Joy comments:

this function will give you desired output

write in functions.php and call <?php list_cats_with_desc() ;?> wherever you want to show it.

<?php
// Create a modified output of wp_list_categories where the categories description
// is added inside a span tag within the link like so:
//<li><a title="Category Description" href="#">Category Name<span>Category Description</span></a></li>
function list_cats_with_desc() {
$base = wp_list_categories('echo=0');

// wp_list_categories adds a "cat-item-[category_id]" class to the <li> so let's make use of that!
// Shouldn't really use regexp to parse HTML, but oh well.
// (for the curious, here's why: http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags/1732454#1732454 )

$get_cat_id = '/cat-item-[0-9]+/';
preg_match_all($get_cat_id, $base, $cat_id);

// Let's prepare our category descriptions to be injected.
// Format will be <a>category-name<span>category-desc</span></a>
$inject_desc = array();

$i = 0;
foreach($cat_id[0] as $id) {
$id = trim($id,'cat-item-');
$id = trim($id,'"');

$desc = trim(strip_tags(category_description($id)),"\n"); // For some reason, category_description returns the
// description wrapped in an unwanted paragraph tag which
// we remove with strip_tags. It also adds a newline
// which we promptly trim out.
if($desc=="") $desc = "Add Description";

$inject_desc[$i] = '<span class="cat-desc">' . $desc . '</span></a>';
$i++;
}

// Now we inject our descriptions
$base_arr = explode("\n", $base);

$base_i = 0;
foreach($inject_desc as $desc) {

// We check whether there's an occurence of "</a>"
while(strpos($base_arr[$base_i], "</a>") === false) {
$base_i++;
}

// If we find one, inject our description <span>
$base_arr[$base_i] = str_replace("</a>", $desc, $base_arr[$base_i]);

$base_i++;
}

$base = implode("\n", $base_arr);
echo $base;
}

?>


pjeaje comments:

it hides empty cats


pjeaje comments:

the descriptions are linked which i don't want and there are no spaces between the descriptions and the cat


pjeaje comments:

I've fixed it :)


pjeaje comments:

// Create a modified output of wp_list_categories where the categories description

// is added inside a span tag within the link like so:

//<li><a title="Category Description" href="#">Category Name<span>Category Description</span></a></li>

function list_cats_with_desc() {

$base = wp_list_categories('echo=0&hide_empty=0');



// wp_list_categories adds a "cat-item-[category_id]" class to the <li> so let's make use of that!

// Shouldn't really use regexp to parse HTML, but oh well.

// (for the curious, here's why: http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags/1732454#1732454 )



$get_cat_id = '/cat-item-[0-9]+/';

preg_match_all($get_cat_id, $base, $cat_id);



// Let's prepare our category descriptions to be injected.

// Format will be <a>category-name<span>category-desc</span></a>

$inject_desc = array();



$i = 0;

foreach($cat_id[0] as $id) {

$id = trim($id,'cat-item-');

$id = trim($id,'"');



$desc = trim(strip_tags(category_description($id)),"\n"); // For some reason, category_description returns the

// description wrapped in an unwanted paragraph tag which

// we remove with strip_tags. It also adds a newline

// which we promptly trim out.

if($desc=="") $desc = "Add Description";



$inject_desc[$i] = '</a> <span class="cat-desc">' . $desc . '</span>';

$i++;

}



// Now we inject our descriptions

$base_arr = explode("\n", $base);



$base_i = 0;

foreach($inject_desc as $desc) {



// We check whether there's an occurence of "</a>"

while(strpos($base_arr[$base_i], "</a>") === false) {

$base_i++;

}



// If we find one, inject our description <span>

$base_arr[$base_i] = str_replace("</a>", $desc, $base_arr[$base_i]);



$base_i++;

}



$base = implode("\n", $base_arr);

echo $base;

}


pjeaje comments:

I'm using html in my descriptions, any chance in keeping this, except the <p> tags as mentioned in the code comments?


pjeaje comments:

Can you please check out this page... http://www.perthmetro.net/asdan/modules/ - Can you tell me how to get rid of the "Categories" text at the very top of the list?

2013-09-09

Liam Bailey answers:

I think the best way to do this is a custom walker for wp_list_categories - I have some code, give me 5 mins and I will update this with some code you can use.


pjeaje comments:

Can you please check out this page... [[LINK href="http://www.perthmetro.net/asdan/modules/"]]http://www.perthmetro.net/asdan/modules/[[/LINK]] - Can you tell me how to get rid of the "Categories" text at the very top of the list?