- This topic has 7 replies, 2 voices, and was last updated 7 years, 11 months ago by
.
Hi,
Is it possible to move the Woocommerce sidebar to go above the content on mobile devices and have a dropdown feature? I’d like to give visitors the ability to filter products easily, even in mobile. Now it looks good on desktop, however, on mobile the left sidebar moves to the bottom of the page, which is not very pleasant if there is like 100 products to go trough.
Best Regards,
Miska
Hi Miska,
I hope you are well today and thank you for your question.
Could you please share me the page URL from your site where it is displaying so that i can help you to achieve it?
Best regards,
Shufflehound teamHi,
We haven’t launched our shop yet, so all of our products are still in private mode, but I added few sample product’s, so you’ll see my meaning.
Best regards,
Miska
You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
@media only screen and (max-width: 1023px) { .woocomerce-styling {display:table;} .woocommerce #content {display:table-footer-group; float: none;} .woocommerce #sidebar {display:table-header-group; float: none;} }Hi,
Thank you! Is possible to add a dropdown feature to the mobile view?
So that customers could access the filters, when they wish, but they don’t have to see them by default.
Best regards,
Miska
I am not sure which dropdown feature you are talking about so could you please describe it a bit more in detail and if possible please share the screenshot of it?
Hi,
I guess, I’ve been using wrong term here. I believe the correct one for this function is “slideToggle”.
So that filter menu (or widget) would be hidden behind a toggle as default, and when you press that toggle, the menu would slide down and show the available filtering options. And this toggle function would only happen in mobile view.
Best regards,
Miska
OK i understood it now and you can achieve it using following solutions.
