WordPress List Categories Hack (Updated 4/5/09)

By Will

Update 4/5/09: All that’s documented on this page can be done via my custom list categories plugin.

Update 1/30/09: If you don’t want to edit your WordPress files, check out my custom list categories function.

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

Replace with:

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

  • ', 'after' => '
    • 

',
'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 . '';

    Replace with:

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

    On line 678 find:

    $output .= "$link";

    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

    The code that is outputted is

    » Category «

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