The Nappy Cat Chronicles

Wordpress Stuff: Wordpress List Categories (wp_list_categories) Hack

If you’re a web designer/programmer like I pretend to be and you also use Wordpress, you eventually discover that, though it’s an awesome weblog platform, Wordpress suffers from inconsistently and poorly constructed functions that may hinder the implementation of your design goals.

Two such functions involve category construction. My categories are listed horizontally almost midway down the “top of the fold” section. In order to achieve my desired design, I had to hack two Wordpress files. Here’s what I did:

Open wp-includes/category-template.php

On line 277 find

'echo' => 1, 'depth' => 0

and replace with

'echo' => 1, 'depth' => 0, 'before' => '<li>', 'after' => '</li>',
'link_before' => '', 'link_after' => ''

These additions to the wp_list_categories function will increase your design flexibility so that, when your style variable is set to 0 or none, you can specify what comes before and after the anchor element and what comes before and after the text that is contained within the anchor element.

Next, we have put those variable somewhere. Open wp-includes/classes.php

On lines 625 and 626 find

$link .= '>';
$link .= $cat_name . '</a>';

and replace with

if ( 'list' == $args['style'] )
$link .= '>' . $cat_name . '</a>';
else
$link .= '>' . $link_before . $cat_name . $link_after . '</a>';

On line 678 find

$output .= "$link<br />";

and replace with

$output .= $before . $link . $after;

So, to get this working, to one of your theme display files (such as header.php or sidebar.php) add

<?php
wp_list_categories('style=0&link_before=» &before=<p>&after=</p>&link_after= «');
?>

The code that is outputted is

<p><a href="/path_to/category">» Category «</a></p>

That’s it! Don’t be afraid to play around with it and add your own variables.