Eliminar los estilos CSS de WooCommerce

Por defecto WooCommerce dispone de hojas de estilo propias dentro de la carpeta assets/css/ del plugin. Estos CSS están escritos con mimo, usando % en las medidas para intentar ser compatibles con la mayoría de temas, pero lo más probable es que queramos darle un toque para adaptarlo a nuestro diseño.


Para esto lo que podemos hacer es eliminar de la cola de carga de estilos los CSS de WooCommerce, y copiar estos archivos CSS en nuestro tema para editarlos según nuestras necesidades. Incluiremos en nuestro functions.php:

// Eliminar los CSS de WooCommerce uno por uno 
add_filter( 'woocommerce_enqueue_styles', 'woocommerce_dequeue_styles' ); 
function woocommerce_dequeue_styles( $enqueue_styles ) { 
unset( $enqueue_styles['woocommerce-general'] ); // Remove the gloss 
unset( $enqueue_styles['woocommerce-layout'] ); // Remove the layout 
unset( $enqueue_styles['woocommerce-smallscreen'] ); // Remove the smallscreen optimisation return $enqueue_styles; 
} 
 // Eliminar todos los CSS de WooCommerce de golpe 
add_filter( 'woocommerce_enqueue_styles', '__return_false' );