Shop Page Padding

Hi, we are looking to add some padding to the sidebar-container. We can modify the sidebar element in a browser inspector, and it works fine. But when adding the same code into the Shop page Custom CSS and reloading the page, the padding doesn’t seem to take into effect.

This is what we put into the Shop page Custom CSS:

.site-content {
padding-left: 50px !important;
}

.sidebar-container {
padding-right: 75px !important;
}

Both of these changes don’t seem to be taken into effect.

Hello,

Please try to apply this code:

body .site-content {
padding-left: 50px !important;
}

body .sidebar-container {
padding-right: 75px !important;
}

If the code does not work, please show the screen where you want to add the space.
Please note: adding the padding increases the width of the block and it can break the whole markup.

Best Regards
Best Regards

Hi, we did as suggested, but there were no changes to the page.

Attachments:

You must be logged in to view attached files.

Hello,

Please provide your site admin access. The code I have provided is workable. I will check at your site.

Best Regards

.

Hello,

Please check your credentials I cannot log in http://prntscr.com/qidqx0

Best Regards

..

Hello,

I have added the style into the Theme Settings > Custom CSS and it works https://prnt.sc/qitcen

Please check the shopping page. It also works having inserted in the Page settings https://prnt.sc/qitf4m https://prnt.sc/qiteqg

Best Regards

Hi, it works when the CSS is placed into Theme Settings > Custom CSS. But I am curious at its behavior: When the code is removed from Theme Settings > Custom CSS, and it is only placed into Shop > Page Settings, it no longer works.

We just did a quick test to add 50px of padding around “.shop-loop-head” in Shop > Page Settings, the code did not change the Shop page. It seems like any CSS placed into the Shop > Page Settings is not taken into effect.

Hello,

I have now checked with the Storefront theme, Page settings CSS is not effective for Woocommerce shop page. We can set the padding for the shopping page and all the categories pages, however, it is not possible to set for the shop page only.

Best Regards

[Author]

Posts