Remove Sidebar from product Page

there is a problem with the sidebar in the product pages they show under the products not on the side like it should be i had this problem and i finally found the fix
There’s a clear div that is messing up with the layout. Please try this on your custom.css

.container .clear { clear: none;}

or if you wanted to remove the sidebar at all from these pages then write this instead:

.woocommerce #sidebar{display:none;}

both worked for me, i hope they work for you

I’m having the same problem in my website https://www.babyplusbrasil.com.br (https://www.babyplusbrasil.com.br/loja/babyplus-sistema-de-educacao-pre-natal/).
I’ve tried mariaarty’s suggestions but it didn’t work.

Any other way to fix that?

Tks a lot.

Carlos Galvao

carlos, your issue is your theme limiting the width of the single page (outside of woocommerces hands)

#home-content, #content {
width: 645px;
margin: 0 10px;
}

Yes, Samuel, but where I can change the product page? There’s no page layout option in it, likewise every other editable pages in my wordpress. If I just remove the side bar, I would gain more space and have this problem no more. Any hint? I can’t change my theme in this stage of the project.

use template files

also, it’s actually better to use this to remove the woo sidebar:

remove_action(‘woocommerce_sidebar’, ‘woocommerce_get_sidebar’,10);

of course, you’d also need to fix your css as samuel mentioned like this:

.woocommerce #content{width:100%}

Hi I am very new to coding and have been having the same issues with my site that uses the Crafty Cart theme https://www.kixclothing.com/clothingstore

How do I fix this?

Here is how to remove the sidebar.

go to wp-content/plugins/woocommerce

in file single-product.php remove the following code

<?php
		/**
		 * woocommerce_sidebar hook
		 *
		 * @hooked woocommerce_get_sidebar - 10
		 */
		do_action('woocommerce_sidebar');
	?>

next edit the file archive-product.php and remove the following code

<?php
		/**
		 * woocommerce_sidebar hook
		 *
		 * @hooked woocommerce_get_sidebar - 10
		 */
		do_action('woocommerce_sidebar');
	?>

next we have to edit the style.css in your theme folder
find
#content-woocomerece
add the following before the } tag on the last line
width:100%;

NOTE: You can not add the /* */ to the line it will not comment it out.

I was able to locate and delete the first 2 steps listed above by kwatts22. However I am having troubles finding the #content-woocomerece or .woocommerce #content.

My site is https://coloradosoap.com/ and I am using the U-Design Template.

Thank you in advance and I can’t wait to get rid of the sidebar!

I looked at your site. It is calling for the wordpress sidebar. Goto Pages Shop and on the right set the template ti full width or no sidebar and click update. You may have to hold ctrl and press F5 for your page to refresh the new changes and not display the old cache version

Thank you kwatts22 for the speedy reply!

I went in and changed the shop page to full width and it did not make any changes. The pages below are not in the pages tab, but rather in the products tab.

https://coloradosoap.com/product/blue-fir-needle-soap-bits-for-re-batching/
https://coloradosoap.com/product/bulk-soap-2/
https://coloradosoap.com/product/bulk-soap/

If I wanted to add the “Cart” to the sidebar, I would put it in the Sibebar 8 as instructed there. It is very easy to get rid of the sidebar in the regular template pages but not in the product pages.

Thank you your help

I’m having the same problem as mariaarty.

The side bar has moved below the products. Is there a way to fix this?
I’m new to wordpress so I was not sure where to put in mariaarty’s suggested code.

Thanks for the help.

Just a quick correction to the code above if you are trying to use it. There is a slight typo. The stuff in the .php files works fine, but the css should be:

.woocommerce #main {
width:100%;
}

Hope that helps!

Im trying to eliminate the sidebar from woo-commerce and i followed @ Kwatts steps but i cant seem to find the #content-woocomerece line in my style.css my page is already set on full-width page and I’ve done the first two steps any help would be appreciated..

There was an update to the woocommerce plugin since I posted this tutorial but if you send me the link to your site I will be happy to take a look.

Hi kwatts22 thanks for the quick response here’s the link to my page https://www.dayonetoronto.com/shop/ thanks any help is appreciated.