Set up filters for mobile

[Maialen Uribarren]

Hi,

In shop and archive pages, I would like to know if it’s possible to set up products filters on mobile. As well as on desktop, in the left side of order by, and then to open a Off Canvas Panel with filters in it.

[David]

Hi there,

this post explains how we did that on the Niche website in the GP Site Library:

https://gpsites.co/niche/how-the-shop-was-made/

You need to read on from the Hook #2 heading. You can ignore the parts about Bread Crumbs.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Maialen Uribarren]

Thank you David,

Now I have the filter icon and text on mobile, but it doesn’t open the Off Canvas Panel.

How can I do it to open the Off Canvas Panel on mobile?

[David]

Have you enabled the Off Canvas Panel in Customizer > Layout > Off Canvas ?

You can then add your Woo filter widgets to the Customizer > Widgets > Off Canvas

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Maialen Uribarren]

Yes, the Off Canvas Panel is enabled.

On desktop it works perfectly, but on mobile it doesn’t open.

[David]

Aah – your Navigation is built with Elementor. The GP Off Canvas panel will only work on mobile if you’re using the GP navigation. You may need to look for an Elementor based solution… sorry i should have checked the site before recommending that method.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Maialen Uribarren]

All right, thank you David!

[David]

You’re welcome

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts