Product filters section above the product list (mobile)

Resolved zaszkowski
(@zaszkowski)

6 years ago

Is there a way to move the sidebar widget section (in my case with product filters) on product list page above the actual products, especially on mobile view? I’m using free version of ShopIsle, maybe there’s an option for that in PRO version?

Now the product filters are shown below the products, at the bottom of the page, which is pretty inconvenient…

The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

estagram
(@estagram)

5 years, 12 months ago
Same issue, hope you have a solution?
- This reply was modified 5 years, 12 months ago by estagram.
Thread Starter zaszkowski
(@zaszkowski)

5 years, 12 months ago
Found this: https://wordpress.org/support/topic/sidebar-showing-just-underneath-product-shop/

and this: https://docs.themeisle.com/article/571-how-to-move-the-shop-sidebar-on-the-top-on-mobile-devices-in-shop-isle

Worked for me 🙂
- This reply was modified 5 years, 12 months ago by zaszkowski.
estagram
(@estagram)

5 years, 12 months ago

Thanks for your solution. Unfortunately it doesn’t work for me. I tried this code. Do you might be make any adjustments?
=================================

@media( max-width: 767px ) {
.woocommerce.post-type-archive .module-small-shop .container {
display: table;
}

.woocommerce.post-type-archive .module-small-shop .container .shop-with-sidebar {
display: table-footer-group;
}
}
.module-small-shop .woocommerce-breadcrumb {
margin-bottom: .1em;
}

mattdew
(@mattdew)

5 years, 9 months ago

I’m also looking for help one this. The code doesn’t seem to work anymore unfortunately.
Thread Starter zaszkowski
(@zaszkowski)

5 years, 9 months ago
In my case it works well. I use:
```
@media( max-width: 767px ) {
   .woocommerce.post-type-archive .module-small-shop .container {    
      display: table;    
   }

   .woocommerce.post-type-archive .module-small-shop .container .shop-with-sidebar {
       display: table-footer-group;
   }
}
```
for breadcrubms, which i don’t use at all:
```
.woocommerce-breadcrumb {
	display:none;
}
```
The whole outcome and the rest of CSS you can check out here:
http://shop.techbase.eu/products/

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Product filters section above the product list (mobile)’ is closed to new replies.