[Resolved] How to create woocommerce product filters

[Suren]

Hi,

Can you please guide me on how to create Off-canvas product filter as shown here: https://websitedemos.net/store-03/shop/ or https://outfits.oceanwp.org/shop/

I would need filter options like price slider, category, and tag filters.

2. Also, how can I create category filters as you see here below the “Portfolio and Filters” section: https://shop.namogo.com/elementor-extras/widgets/posts/

Thanks for your help.

[David]

Hi there,

you can use the Off Canvas Panel as it has its own Widget area which you can add any of the Woo widgets too:

https://docs.generatepress.com/article/off-canvas-panel-overview/

Its used in this GP Site.

https://generatepress.com/site-library/#niche

The sites blog contains 4 posts explaining how i moved the off canvas toggle to only display above the shop grid. Easiest option would be to use this Site as your starter site.

[Suren]

Hi David,

Thanks for your support. I was able to add the off-canvas filters but for some reason, I am not able to get the categories menu to display below the SHOP title as shown here:https://gpsites.co/niche/shop/

I used the same code for the hook as was provided here: https://gpsites.co/niche/how-the-shop-was-made/ but that display the raw code on the frontend instead of the actual category names.

What am I doing wrong here?

[Tom]

Hi there,

Is the “Execute PHP” option checked in your Hook Element?

Let me know 🙂

[Suren]

Hi Tom,

My bad. That was unchecked. Problem solved. Thanks for your help.

[David]

Glad we could be of help

[Author]

Posts