Sidebar Request!

1. I want to show the blog post below the navigation on the shop page. But the sidebar stays below the blog post (1 & 2.jpg). I want the sidebar to align with the all product (3.jpg).

2.How to remove the spacing between navigation and blog posts (1 & 3.jpg).

Attachments:

You must be logged in to view attached files.

Hello,

I saw the screenshots you attached and visited the URL you attached.

1) For Screenshot 1: Please add the following Custom CSS in the Custom CSS for desktop area under Theme Settings >> Custom CSS.

.widget-area.woodmart-sidebar-content {
margin-top: 335px !important;
}
.main-page-wrapper {
padding-top: 0px;
}

2) Your screenshot doesn’t really clarify what you actually require. Please provide me with some relevant screenshots of the specific area to check it myself and help you out accordingly.

Best Regards.

Hi, thanks for your reply.I saw the screen looks better.
1.There are some minor problems. If the browser changes, the position of the sidebar will also change, and it is not align with the product. (1,2.jpg)
2.The new CSS also affects the sidebar of the article page.(3.jpg)

Attachments:

You must be logged in to view attached files.

Hello,

I saw the screenshots you attached. Please Replace the previous code with the following in the Custom CSS for Desktop area under Theme Settings >> Custom CSS.

.sidebar-container.sidebar-left.area-sidebar-shop {
margin-top: 335px;
}

This will only affect the shop page sidebar.

You can adjust the margin value to fit as per your requirements.

If the problem continues then provide admin panel login details of the website to check it myself and help you out accordingly.

Best Regards.

Hi, thanks, the blog page is now fine. But there is still no change in the shop page. When the width of the browser over 1400px, the blog picture hides the top of the left sidebar.

Attachments:

You must be logged in to view attached files.

Hello,

I have visited your website and the sidebar for both the shop page and the blog page is working absolutely fine on my end.

Screenshot for Clarification: https://ibb.co/fNs9pcS
https://ibb.co/PxLBtwd

Please clear cache and check back.

And for the width please provide me with some relevant screenshots to check it myself and help you out accordingly.

Best Regards.

1. I think this is a screen resolution problem. I tried it on a 1024x768px laptop and it worked very well. If the browser width exceeds 1400 pixels, the blog picture will be hidden at the top of the left sidebar. My desktop screen resolution is 1680x1050px. (1.jpg)

2. I want to use CSS to change the search filter and the sticky sidebar icon on the mobile version. But failed. Please help check the code. (2.jpg)

body .woodmart-show-sidebar-btn:before,
body .woodmart-sticky-sidebar-opener:after{
content: “\f00e”;
font-family: “fontawesome” !important;
display: inline-block;
font-size: 30px;
font-weight: 400;
}

body .woodmart-show-sidebar-btn::before {
margin-right: 5px;
}

body .woodmart-show-sidebar-btn .woodmart-side-bar-icon {
display: none;
}

3. Helps move the sticky sidebar below the menu. (2.jpg)

Attachments:

You must be logged in to view attached files.

Hello,

I saw the screenshots you attached. Please deactivate all the third party plugins, activate parent theme.

Then Regenerate CSS from Woodmart >> CSS Generator. Clear browser cache and check back.

If the problem continues then provide with admin panel login details of the website to check it myself and help you out accordingly.

Best Regards.

All is done as you said, but nothing has changed.

Hello,

1) Your issue about the width is resolved. Please clear cache and check back.

Screenshot for Clarification: https://ibb.co/vxXZMgj

2) And for the icon change please add the CSS in the Custom CSS for Mobile area under Theme Settings >> Custom CSS.

Best Regards.

Hi,
1. I saw the sidebar of desktop version is fine now, mobile version still no change.
2. Following your suggestions, the icon is still broken.

Attachments:

You must be logged in to view attached files.

Hello,

1) I have changed the icon of the sidebar for the mobile. Please clear cache and check back.

Screenshot for Clarification: https://ibb.co/gwpkP66

2) And for the mobile please move the CSS code you added for the sidebar desktop in the Custom CSS for Desktop area Under Theme Settings >> Custom CSS. Then Clear cache and check back.

Best Regards.

[Author]

Posts