Para algún proyecto he necesitado personalizar con colores diferentes familias de categorías. Para poder pintar una subcategoría del mismo color que su categoría padre, es necesario tener identificada de alguna forma la ID de la categoría padre en el código, y lo más útil suele ser añadirla al body con una clase tipo “category-top-3”.

El siguiente código hace uso del rastro de migas de nuestra tienda, concretamente en la primera línea estoy obteniendo el link de la categoría padre, dependiendo de la plantilla es posible que tengáis que adaptar el selector.

Si tenéis algún módulo que elimine las IDs de las URLs este código no os servirá.

var urlTopCat = jQuery("#breadcrumb_wrapper li:nth-child(3) > a").attr("href");
var urlTopCat = urlTopCat.split('dominio.com/');
urlTopCat = urlTopCat[1].split('-');
jQuery("body").addClass("category-top-"+urlTopCat[0]);