Cómo asociar iconos a las categorías y crear un listado con orden personalizado en WordPress

Existen dos plugins de WordPress que permiten usados conjuntamente asociar una imagen a cada categoría de WordPress y ordenar una lista de categorías a voluntad, siguiendo un criterio personlizado, ya que hay casos en los que las opciones de las funciones de WordPress que nos devuelven un listado de categorías se nos pueden quedar cortas. Los plugins son Category Icons y Category Order.

Para conseguir un listado de categorías en WordPress podemos usar la función get_categories; en el ejemplo listaremos todas las subcategorías de una categoría. Abrimos un foreach para poder obtener la información de cada una de las categorías:

<?php
$col_id = 'ID'; // sustiruir ID por el ID de la categoría
$html = "<div class='cat-list'>";
foreach ( get_categories("child_of=$col_id&hide_empty=1") as $categ ) {

Dentro del foreach obtenemos las variables que necesitamos:

$categoryID = $categ->term_id;
$categLink = get_category_link($categ->term_id);
$categDesc = category_description($categ->term_id);

La imagen asociada a cada categoría la obtenemos con la función que nos proporciona el plugin Category Icons:

$categImg = get_cat_icon("cat=$categoryID&echo=false");

Luego montamos la salida HTML para cada categoría:

$html .= "
<div class='cat-item'>
<div class='cat-img'>$categImg</div>
<div class='cat-data'>
<a class='cat-tit' href='$categLink' title='$categ->name'>$categ->name</a>
<div class='cat-desc'>categDesc</div>
</div>
</div>
";

Ya solo queda cerrar el foreach y hacer echo de la variable $html:

}
echo $html;
?>

El código completo quedaría:

<?php
 $col_id = 'ID';
 $html = "<div class='cat-list'>";
 foreach ( get_categories("child_of=$col_id&hide_empty=1") as $categ ) {
    $categoryID = $categ->term_id;
    $categLink = get_category_link($categ->term_id);
    $categDesc = category_description($categ->term_id);
    $categImg = get_cat_icon("cat=$categoryID&echo=false");
    $html .= "
      <div class='cat-item'>
      <div class='cat-img'>$categImg</div>
      <div class='cat-data'>
      <a class='cat-tit' href='$categLink' title='$categ->name'>$categ->name</a>
      <div class='cat-desc'>categDesc</div>
      </div>
      </div>
    ";
 }
 echo $html;
?>