I have a problem with the Storefront child theme. I created a Storefront child theme like they suggest here: https://docs.woocommerce.com/document/set-up-and-use-a-child-theme/
The child theme works fine, I can write my CSS, write my code inside functions.php and override template files, but the child theme still loads the parent theme CSS.
How I can create a child theme without the parent's CSS loaded?
Add these functions to your child theme's functions.php.
This code will disable the loading of the Storefront default CSS.
Source: https://github.com/stuartduff/storefront-child-theme
/**
* Storefront automatically loads the core CSS even if using a child theme as it is more efficient
* than @importing it in the child theme style.css file.
*
* Uncomment the line below if you'd like to disable the Storefront Core CSS.
*
* If you don't plan to dequeue the Storefront Core CSS you can remove the subsequent line and as well
* as the sf_child_theme_dequeue_style() function declaration.
*/
add_action( 'wp_enqueue_scripts', 'sf_child_theme_dequeue_style', 999 );
/**
* Dequeue the Storefront Parent theme core CSS
*/
function sf_child_theme_dequeue_style() {
wp_dequeue_style( 'storefront-style' );
wp_dequeue_style( 'storefront-woocommerce-style' );
}
Also, you can disable the WooCommerce standard stylesheets,
Source: https://docs.woocommerce.com/document/disable-the-default-stylesheet/
/**
* Set WooCommerce image dimensions upon theme activation
*/
// Remove each style one by one
add_filter( 'woocommerce_enqueue_styles', 'jk_dequeue_styles' );
function jk_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;
}