Docs

[powrider686]

Hello,
On my site and shop, https://roadsidegallery.com/shop/, when viewed on mobile the category dropdown is pushed to the bottom of the page under all of the products, which makes it hart to sort by category without tons of scrolling.

Is there a way to have the category selector dropdown show at the top of the page before the products?

How might I achieve that and thanks for the help!

Marcus

[Rad]

Hi there,

Thank you for posting in.

Just the category filter or the whole sidebar? I tried but it’s quite problematic due to responsive nature and javascript. But if’s just changing the order of sidebar and content (top sidebar), then add this CSS should be enough

  @media ( max-width: 979px ) {
  .x-sidebar-content-active .x-main{
  	display:table-footer-group;
  }
  .x-sidebar-content-active .x-sidebar{
    display:table-header-group;
  }
  .site > .x-container-fluid.max {display:table;}
  }    

Thanks!

[powrider686]

I just wanted the category filter so that you could easily view the different categories of the shop on mobile.

Could it be possible to do it as you suggested by then hide the Cart and Top Rated products on mobile?

Otherwise it would be best to just have the category filter at the top of the page.

Thanks for the help!

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

@media (max-width:767px){
div#woocommerce_widget_cart-2, div#woocommerce_top_rated_products-2 {
    display: none;
}
}

Hope that helps.

[Author]

Posts