How to remove the woocommerce.css file from the theme? - php

Question

I am using WordPress and I installed the Woocommerce plugin.
I added the template folder in my theme and started to customize my theme.
Now, I have to remove the Woocommerce.css from my theme and I found code on the official website here
I added the same code in the function.php
add_filter( 'woocommerce_enqueue_styles', '__return_empty_array' );
or
add_filter( 'woocommerce_enqueue_styles', '__return_false' );
but both answers are not working. I have installed the 5.7.1 Woocommerce.
How can I solve this issue?
function.php
function customtheme_scripts() {
wp_enqueue_style( 'customtheme-style', get_stylesheet_uri(), array(), time() );
wp_style_add_data( 'customtheme-style', 'rtl', 'replace' );
wp_enqueue_script( 'customtheme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), _S_VERSION, true );
if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
wp_dequeue_style( 'customtheme-woocommerce-style' );
}
add_action( 'wp_enqueue_scripts', 'customtheme_scripts' );
view source
The domain name is just an example.

Answer 1

This answer has been fully tested on woocommerce 5.x+ and works fine on the default woo style sheets! If you're using a custom theme and/or custom style sheet then you may encounter some discrepancies.
What you see on the documentation page, no longer works on woo 4+, according to their github page.
So you need to dequeue its styles!
wp_dequeue_styleDocs
So if you only want to remove woocommerce.css file, then you could do this:
add_action('wp_enqueue_scripts', 'removing_woo_styles');
function removing_woo_styles()
{
wp_dequeue_style('woocommerce-general'); // This is "woocommerce.css" file
}
However, if you want to remove all of the style sheets loaded by woo, then you could use this:
add_action('wp_enqueue_scripts', 'removing_woo_styles');
function removing_woo_styles()
{
wp_dequeue_style('wc-block-vendors-style');
wp_dequeue_style('wc-block-style');
wp_dequeue_style('woocommerce-general');
wp_dequeue_style('woocommerce-layout');
wp_dequeue_style('woocommerce-smallscreen');
}
If you still can see the styles, then try to clean your cache.
UPDATE related to the question "custom style sheet"
At the time that I was writing the answer you had not provided any screenshot of your style sheet, nor did you say anything about using a custom style sheet. That's why you were not able to get it to work.
Please do NOT copy/paste if you're using a custom style sheet, like the custom css file used in the question. wp_dequeue_style function takes your style sheet handle as the argument. So please read the documentation first. You're using a custom handle name (i.e "customtheme-woocommerce-style"), therefore, you need to use that handle name.
add_action('wp_enqueue_scripts', 'removing_woo_styles');
function removing_woo_styles()
{
wp_dequeue_style('customtheme-woocommerce-style'); // This is your "custom style sheet" file.
}
Also note that commenting out the enqueue section in the main file (i.e inc/woocommerce.php) may work temporarily but on the next woo update, it'll come back again. So, it's recommended to avoid updating your template files as much as possible unless you really have to which is not the case here!