Woocommerce single product layout fullwidth

[salilou]

Hi,
I want to make a Woocommerce single product layout fullwidth.
Especially the product images gallery should be fullwidth with no gaps to left and right.
The gallery is a component, that I built.
This CSS solution does not work:

Full-Width WooCommerce Product Page

Hi, I have done this before but now I just can’t figure it out. How can I make a WooCommerce product page full width? I have another website running theme pro with full-width product pages (the link is in a secure note) and it doesn’t have any additional CSS, so I’m searching for a way to do it without adding any custom CSS. Thanks.

Please see the link to the development site in the secure note.
Thank you very much!
Hannes

[prakash_s]

Hello @salilou,

Thanks for writing to us.

In order to make the full-width you have added the custom CSS code I would add this custom CSS code to remove the padding which is rendering from the left/right. You can add this custom CSS code to the layout CSS.

.woocommerce.single-product .x-layout-single .entry-wrap {
    padding: 0 !important;
}

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[salilou]

Thank you very much!

[tristup]

Hi Hannes,

You are most welcome.