店面子主题仍加载父CSS

时间:2018-12-27 12:23:39

标签: css wordpress storefront

我对店面子主题有疑问。 我创建了一个店面子主题,就像他们在这里建议的那样:https://docs.woocommerce.com/document/set-up-and-use-a-child-theme/

子主题可以正常工作,我可以编写CSS,可以在functions.php中编写代码并覆盖模板文件,但是子主题仍会加载父主题CSS。

如何在不加载父级CSS的情况下创建子主题?

1 个答案:

答案 0 :(得分:0)

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;
}