Show categorys all on one page?

Hi there, does anybody know how I could get a page like redtube have here (http://www.redtube.com/channels) to display links to my wordpress's categorys along with an image for each category?
I've done a few google searches and can't find much.
Thanks for the help

 

step 1.
create a category named "all-categories" ( or whatever you please, i would refer to it as all-categories from here on ).

step 2.
create a template-category file into your theme folder with the following changes:
- name it as "category-<your-all-categories-slug>.php" if using wp 2.9 or higher, else "category-<your-all-categories-id>.php"
this will make the wp choose the aforesaid template in stead of using the default category template.

step 3.
instead of showing the posts, like

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
.
.
.
.
<?php endwhile; endif; ?>

PHP:

show your categories like:

<?php
$cat_specs = array(
    title_li => ,
    depth => 1
);
?>
<ul class="my-list-all-categories">
    <?php wp_list_categories( $cat_specs ); ?>
    <li><br style="clear: left; font-size: 0; line-height: 0;" /></li>
</ul>

PHP:

step 4.
then you can style the list in the following manner:

<?php 
    $prefix = get_bloginfo("template_url") . "/images";
    //  you should replace "images" with the path of 
    //+ the images folder relative to your theme directory.
    $my_cats = get_categories( "parent=0" );
    //  remember that you should replace zero with 
    //+ the id of the parent of all the categories you want to display.
?>
<style>
ul.my-list-all-categories {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.my-list-all-categories li {
    float: left;
    width: 100px;
    height: 125px;
    font-size: 12px;
    font-weight: bold;
    background: transparent url( "$prefix/blank.gif" ) no-repeat center top;
    margin: 0 0 5px 5px;
    padding-top: 106px;
}
<?php foreach( $my_cats as $my_cat ) : ?>
ul.my-list-all-categories li.cat-item-<?php echo $my_cat->cat_ID; ?> {
    background-image: url( "$prefix/cat-<?php echo $my_cat->slug; ?>.gif" );
}
<?php endforeach; ?>
</style>    

PHP:

step 5.
now upload 100X100px thumbnails of all the categories in the images folder of you template with the following filename format.
"cat-<your-category-slug>.gif"

ps: you can tweak this method to your particular needs like, use png, or jpg instead of gif, or include all categories, instead of just the top level categories.

refer:
http://codex.wordpress.org/Template_Tags/wp_list_categories
http://codex.wordpress.org/Function_Reference/get_categories
http://www.clickonf5.org/wordpress/wordpress-category-object-fields/6068

 

Thanks that was exactly what I wanted
Rep added