Hemos preparado un hack muy simple para que, en las paginas de navegacion de categorias (category.php) se puedan visulizar las subcategorias junto con una imagen representativa, el nombre (enlazado) y la descripción de las mismas.
En primer lugar crea dentro de tu theme una carpeta “cats” dentro de la carpeta “images” (images/cats) que será la que contenga las imágenes (se nombran en función del ID de la categoría relativa).
Crea imágenes de hasta 240pixeles (según este ejemplo) de ancho y mételas dentro de la carpeta que has creado, atendiendo únicamente a que exista una imagen con cada ID de categoría en tu sitio web. EJ. La imagen de la categoría “Referencias” es: “39.png”

Luego, en category.php inserta el código:
<ul id="listcategories">
<?php
global $ancestor;
$childcats = get_categories('child_of=' . $cat . '&hide_empty=0');
foreach ($childcats as $childcat) {
if (cat_is_ancestor_of($ancestor, $childcat->cat_ID) == false){
echo '<li>';
echo '<img src="' . get_bloginfo('template_directory') . '/images/cats/' . $childcat->cat_ID . '.png" alt="' . $childcat->cat_name . '" class="thumbshot" /><br clear="left"/>';
echo '<a href="'.get_category_link($childcat->cat_ID).'">';
echo $childcat->cat_name . '</a>';
echo '<p> '.$childcat->category_description.' </p></li>';
$ancestor = $childcat->cat_ID;
}
}
?>
</ul>
<hr />
Anuncios GRATIS de Pisos en Alquiler www.pisosenalquileren.com
Y para darle el estilo que te enseñamos más arriba, pega en tu css:
/* Listados en category.php */
#listcategories, #listcategories ul { text-align:center}
#listcategories li {display: inline-table; list-style:none; margin-bottom:20px; margin-right:25px; width:240px; text-align:left}
#listcategories li a { display: inline-table; list-style:none; margin:0 20px -10px 0; font-family:'Oswald',sans-serif; font-weight:normal; font-size:16px; color:#454545; text-transform: uppercase; vertical-align:text-top; line-height:1em;}
#listcategories li p {font-size:11px; text-transform: none; font-family:Arial, Helvetica, sans-serif; padding:0px; }
img.thumbshot, a img.thumbshot{margin-right:15px; margin-bottom:12px; border:1px #ddd solid; padding:5px; background:#fafafa; margin-left:0; -moz-border-radius:2px; -webkit-border-radius:2px; -khtml-border-radius:2px; border-radius:2px}
Simple
¿no?
Como sabes siempre puedes mostrar un icono en la vista de categoría, vinculado a tus RSS con el codigo:
<h2><a href="<?php echo $_SERVER['REQUEST_URI'] . '/feed' ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/rss.png" border="0" alt="RSS" /></a> <?php echo single_cat_title(); ?></h2>






