Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Remove unused styles from wordpress

I'm trying to dequeue/deregister styles that are unneccesarry(WooCommerce,Contact form 7) from all post/pages of my wordpress website.

Tried offical WooCommerce's way to disable these extra styles and scripts, but it's not dequeue-ing those since styles are still loaded in the source code and Google PageSpeed Insights is still showing them as being rendered; so:

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

// Or just remove them all in one line
add_filter( 'woocommerce_enqueue_styles', '__return_false' );

in functions.php Isn't working. I also tried to remove them like this:

function remove_assets() {
    wp_dequeue_style('wc-block-vendors-style-css');
    wp_deregister_style('wc-block-vendors-style-css');
}
add_action( 'wp_print_styles', 'remove_assets', PHP_INT_MAX );

Pointing at specific style id wc-block-vendors-style-css and setting PHP_INT_MAX. It's still not removing that specific style.

enter image description here

Notes:

This functions.php belongs to the child theme of a custom, redone twenty-twenty WordPress theme and cache has been cleared. I've tried most of the answers here from the StackOverflow of users' having similar issues, but not a single one worked.

Woocommerce support is enabled in the theme.

How to dequeue/deregister styles and scripts with WordPress 5.6 in 2021?

like image 746
Ognj3n Avatar asked Jan 04 '21 10:01

Ognj3n


People also ask

How do I delete a style in WordPress?

To unload the styles, another function has to be created in the functions. php file. The function checks the specific page that you don't want the styles to appear. is_page function will check a required page to remove CSS styles.

How do I clean up unused CSS?

If you want to remove unused CSS entirely, you can use a tool such as PurifyCSS to find out how much CSS file size can be reduced. Once you get the CSS code you should eliminate, you have to remove it manually from the page.


1 Answers

According to @Aliakseyenka Ihar - I've tested myself, When I added deregister before wp_dequeue_style - it removes the vendor-style

function remove_assets() {
    wp_deregister_style('wc-block-vendors-style');
    wp_dequeue_style('wc-block-vendors-style');
}
add_action( 'wp_enqueue_scripts', 'remove_assets', 11);

Or ninja way

add_filter( 'wp_enqueue_scripts', 'jk_dequeue_styles', 99999 );
function jk_dequeue_styles( $enqueue_styles ) {
    global $wp_styles;
    unset ( $wp_styles->registered['wc-block-vendors-style'] );
}
like image 82
Andrii Kovalenko Avatar answered Oct 19 '22 09:10

Andrii Kovalenko