diferentes colores para categorías shortcode woocommerce  

Hola, Pablo

Lo que comentas no es una funcionalidad nativa de WooCommerce y tampoco de WordPress, lo que implica modificar código en tu tema/plantilla en uso para que las categorías muestren un color diferente.

Por ejemplo, puedes crear una función en PHP que lo haga, aunque será algo muy manual.

function my_custom_category_class( $class, $category ) {
if ( $category->term_id == XXX ) { // Cambia XXX con el ID de tu categoría
$class[] = 'categoria-roja';
} elseif ( $category->term_id == XXX ) {
$class[] = 'categoria-azul';
}
return $class;
}
add_filter( 'post_class', 'my_custom_category_class', 10, 2 );

Nota: Existen plugins como "Code Snippet" que te permiten añadir fácilmente código en WordPress sin tocar el "delicado" archivo "functions.php".

Y luego crear la clase CSS que se encargará de pintar el color correspondiente a cada categoría que declares en la función:

.categoria-roja {
background-color: red;
}

.categoria-azul {
background-color: blue;
}

Evidentemente, en el CSS puedes declarar el color, la tipografía, el tamaño de esa tipografía, etc. A fin de cuentas es CSS y es totalmente personalizable.

En nuestro Curso 100% GRATUITO de CSS en WordPress explicamos cómo editar elementos y aplicar cambios de tamaños, etc., https://www.webempresa.com/university/curso-css-wordpress/

Si no quieres tocar código, existen plugins como "StoreCustomizer – A plugin to Customize all WooCommerce Pages" https://wordpress.org/plugins/woocustomizer/ que te permiten bastantes opciones de personalización.

Quedo pendiente de tus indicaciones para seguir ayudándote. 😊

@alejo

Buenas, lo primero muchas gracias. He metido la función en funtions.php directamente y no funciona, (entiendo que el css hay pegarlo en el css personalizado del modulo donde tengo el shortcode   (estoy usando divi))

paso pantallazos para que veas por si he puesto algo mal, ya me dices

Un saludo

Hola, Pablo

La personalización funciona, pero dependerá de qué método uses para colorear manualmente las etiquetas de las categorías de productos de WooCommerce.

Tal como te recomendé en mi anterior respuesta, lo mejor es que NO incluyas esa función en el archivo functions.php de tu tema, ya que es un archivo delicado y puedes obtener resultados no deseados o la rotura del sitio web.

Mejor usar plugins como "Code Snippets" https://wordpress.org/plugins/code-snippets/ para añadir la función, de forma que puedas editarla fácilmente y activarla o desactivarla para pruebas, etc.

 
Luego tienes que añadir el código CSS en "Apariencia > Personalizar > CSS personalizado" de forma que las clases declaradas en la función adquieran los estilos indicados.

Dime si puedes implementar hasta este punto tu personalización de etiquetas.

Saludos 😊 

@alejo

Hola otra vez, no me funciona. Instale el plugin e inserte la función

 y puse el css en apariencia personalizar y no funciona

y entiendo que para colorear las etiquetas bastaría así:

}

.categoria-lavamanos {
background-color: #009999 !important;

}

como indico al principio del tema, estoy usando un shortcode de woocommerce pegado en un módulo de texto de divi y así he ido modificando cosas como el color con css en el mismo módulo, por si te da alguna pista.

un saludo y gracias

Hola Pablo,

Necesitamos la URL correcta donde estás tratando de implementar esto, nos compartes una que no guarda relación con la captura que nos envías.

Quedamos atentos.

Un saludo 

Hola Karen, la web todavía no esta operativa, esta en un alojamiento temporal

te paso la url del sitio: https://lafazcto-cp529.wordpresstemporal.com/ICMtienda

Un saludo y gracias

Hola Pablo,

Como te comenta Luis, lo que comentas no es una funcionalidad nativa de WooCommerce y tampoco de WordPress, lo que implica modificar código en tu tema/plantilla en uso para que las categorías muestren un color diferente.

En este caso desde foro no ofrecemos códigos personalizados hechos a medida ni modificaciones de la plantilla, quizás lo que te beneficie sería crear tú mismo la plantilla de categorías, o crear manualmente la página, sin hacer un llamado a las categorías, de esta forma puedes construirla como gustes.

Un saludo 🖐️