Remove sidebar from all woocommerce pages

Hello,

Could you please give this CSS code a try?

.woocommerce .widget-area {
display: none;
}

You can add this in a Child Theme style.css file or you can use a custom CSS plugin.

Please let me know how it goes.

Have a great day!
Alex

Put it in the child theme CSS it did not work :'(

Hello,

It actually is working. ?? You are probably not seeing the changes because of your website cache. Always clear your website cache after updating CSS files. A caching plugin might include WP Super Cache, W3 Total Cache, or WP Rocket.

I believe this CSS will better accomplish your goal, could you please replace my previous code with this?

.post-type-archive-product .widget-area {
display: none;
}
.post-type-archive-product .content-area {
width: 100%;
}

Thanks,
Alex

Better yet you could just change the template to “Full Width” on your main shop page.

Edit*

To remove the sidebar from the rest of the WooCommerce pages you can add this to your child theme functions file.

remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );

@alex I added your code and it seems to work only for the shop page ?? I want to reproduce that effect for my entire website

@pip Thanks for your input, it does not seem to get the job done :'(

Actually try this:

Also things to consider: make sure you have updated to the newest version of Storefront and make sure this stuff is going in a child theme functions file…

add_action( 'init', 'sf_child_remove_parent_theme_stuff', 0 );
function sf_child_remove_parent_theme_stuff() {
	remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
}

Give this a try;

add_action( 'init', 'jk_remove_sidebar' );
function jk_remove_sidebar() {
remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
}

That will remove the sidebar entirely, site-wide.

I have added the following to the PHP functions file:

add_action( 'get_header', 'remove_storefront_sidebar' );

function remove_storefront_sidebar() {
	if ( is_product() ) {
		remove_action( 'storefront_sidebar', 'storefront_get_sidebar',			10 );
	}
}

and the following to CSS file:

body.woocommerce #primary { width: 100%; }

body.woocommerce.single-product #primary { width: 100 %; }

The effect is that sidebar seems to be completely removed from single product page, but moved downwards in other woocommerce pages. I cant tell if the PHP additions are having any effect at all :S

Will try your reccomendations guys bare with me!

@james Koster This seems to have done the trick! Thank you!

Good info here I think. I just want to remove the sidebar on my woocommerce catalog pages like this one: https://www.orienttrail.com/?product_cat=yoga-pants . It is already removed from my single product pages (by design).

I am using a child theme. Which code above should I use? And exactly where to put it?

Thanks in advance.

In functions file (or in Code Snippets):

function remove_storefront_sidebar() {
    if ( is_archive() ) {
            remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
    }
}
add_action( 'get_header', 'remove_storefront_sidebar' );

And then tweak CSS accordingly.