How to create fixed Shop Filter Siderbar ?

I can’t seem to setup my shop page/pages with a fixed filter siderbar like your demo page . Really not sure what im missing!

Also, is there any way to change the QuickView logo or change it to text?

I sorted it out, although i need help with the quick view 🙂

Hello,

Thank you very much for choosing our theme and for contacting us.

What text or icon do you want? You can choose from this source https://fontawesome.com/v4.7.0/icons/ and I will provide a custom CSS.

Best Regards

No worries,

Ill let you know soon, thank you!

I’d also like to know if it were possible to set the font colour for a Mega Menu different in the sticky.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

/*sticky main menu color*/
body .whb-sticked .woodmart-navigation  .item-level-0.current-menu-item>a{
color:yellow;
}
body .whb-sticked .woodmart-navigation  .item-level-0>a{
color:yellow;
}
body .whb-sticked  .woodmart-navigation  .item-level-0>a:hover{
color:red;
}
body .whb-sticked .woodmart-navigation .item-level-0.menu-item-has-children>a:after{
color:yellow;
} 
body .whb-sticked .woodmart-navigation .item-level-0.menu-item-has-children:hover >a:after{
color:yellow;
}

Replace the colors as per your needs.

Best Regards

Hey,

That only seems to work for “MY ACCOUNT” and not the rest of the menu options from the Mega Menu.

Just realised that the product filter documentation is gone, as the developer rebranded and is redirecting links.

I’m trying to make a menu item for the “Best Sellers” of a category without having to create a custom page for it, im not sure how to do this with just the URL and i cant refer to the documentation at the moment.

Hello,

Replace the code with this one:

/*sticky main menu color*/
body .whb-sticked .woodmart-navigation  .item-level-0.current-menu-item>a{
color:yellow;
}
body .whb-sticked .woodmart-navigation  .item-level-0>a{
color:yellow;
}
body .whb-sticked  .woodmart-navigation  .item-level-0>a:hover{
color:red;
}
body .whb-sticked  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link {
color:yellow;
}
body .whb-sticked  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link:hover {
color:red;
}

To show the “Best Sellers” use the Grid Product element https://xtemos.com/docs/woodmart/faq-guides/product-grid-carousel-element/ in HTML block https://xtemos.com/docs/woodmart/html-blocks-2/ and insert HTML block shortcode in the place you need.

Best Regards

[Author]

Posts