Pro 4.3.3 - WooCommerce - Shop Widget/Filter Bug?

[sam_futr]

Hi Team

When adding a sidebar with WooCommerce filter options (Ajax Widgets I think) new “Widget Area” element does not respond properly, so the Shop does not filter from the selections made. This specifically occurs when trying to filter using a dropdown option, as the Price Filter does work for example.

To note - this Shop page has been created via the new Pro Layout functionality, with a standalone column added and the Widget Area element added to said column. This is not a default Shop layout.

Also, on Mobile I am attempting to create a Mega Menu “Filter” button, and then show the Shop widgets within this Modal per below. The filtering does not work very well with this either:

Will add login details.

Thanks
Sam

[christian]

Hey Sam,

Yes, the WooCommerce Widget Filters use AJAX however, it’s not integrated with the Loopers. There’s no feature for that. I’m yet to submit this as a feature request.

For now, what you can do is set up Term buttons. Examples of WooCommerce Terms are Product Categories, Product Tags, and Product Brands which is provided by a 3rd party plugin.

Please note that we don’t provide support for 3rd party plugins. I’m just setting up an example below because this applies generally to all Terms. The setup is as follows:

1. Add a Div element to be a Term Looper Provider.

2. Add a Button element to the Div element and in the buttons URL field, insert this ?filter_brand={{dc:term:slug}}. I got the filter_brand query from the WooCommerce Filter or that’s how the WC filter works. The Dynamic Content part outputs the term’s (brand) slug.

3. Like the URL setup, set the Text of the Button to be the Term Name.

I’ve tested this on your site so it will also serve as an example. Just note that this is not AJAX powered. When you click the buttons, it will reload the page but will show the correct items according to the term.

Do the rest for your other terms.

---

Regarding the modal element and the filters, would you mind describing the issue in detail? By “not working really well”, are you not able to click the filter or select anything in the filter?

If you mean you can’t scroll down the modal on mobile, try setting the Overflow option of the Mega Menu element to Visible.

Thanks.

[sam_futr]

@christian - Please don’t ever make front end changes to a live site without first checking. You have left the below buttons on my client’s website:

CC @alexander

I will also respond in-depth to your message below via an additional message.

Thanks
Sam

[sam_futr]

@alexander - I think you’ll want to be across this also.

@christian

@christian

Yes, the WooCommerce Widget Filters use AJAX however, it’s not integrated with the Loopers. There’s no feature for that. I’m yet to submit this as a feature request.

Per above, does this mean that any time a Layout is created for a Shop Archive we are unable to properly utilise the default WooCommerce widgets? This seems like a very large oversight.

I’m not expecting it to filter via AJAX (understand this feature may not yet be available), but the filters themselves should still be able to work ie. simply refreshing the page rather than AJAX.

The Filters in question that are not responding to selections are the below ones - they are Filters of Product Attributes:

I have subsequently updated to the non-AJAX Product Variation filter widget (per below) and it is still not updating/filtering the Shop products:

Please review and advise. I think we should be able to use the default Widgets without the need to manually create Buttons like you have below.

Thanks
Sam

[christian]

Hey Sam,

To your concern:

@futrdigital

Please don’t ever make front end changes to a live site without first checking. You have left the below buttons on my client’s website:

I apologize for that but my intention is to leave an example. Please expect that we sometimes need to test directly in your given site so if editing the live site is not allowed, please provide a staging copy of your site next time.

@futrdigital

Per above, does this mean that any time a Layout is created for a Shop Archive we are unable to properly utilise the default WooCommerce widgets? This seems like a very large oversight.

I’ve tested further and in my site, the WC Filter Widgets reload the page and the products are filtered so there’s something in your site that is causing the page not to reload so I’ve discovered that WC Filters does not use AJAX. I just thought it’s AJAX because I tested on your site directly.

With that said, please do test for a plugin conflict and also activate the parent theme and check custom JS codes in your site to see if they’re preventing the page to reload.

@futrdigital

The Filters in question that are not responding to selections are the below ones - they are Filters of Product Attributes:

Yes, that is what I’ve tested and that is what I’ve discussed in my previous response.

@futrdigital

I’m not expecting it to filter via AJAX (understand this feature may not yet be available), but the filters themselves should still be able to work ie. simply refreshing the page rather than AJAX.

@futrdigital

I have subsequently updated to the non-AJAX Product Variation filter widget (per below) and it is still not updating/filtering the Shop products:

Please see my answer above that the WC Filters reload the page on my site.

@futrdigital

Please review and advise. I think we should be able to use the default Widgets without the need to manually create Buttons like you have below.

The only solution for your site right now is to use links or buttons. There’s no other way for now.

I’ll be testing the WC filters some more and submit and report my discovery to our development team.

Thank you for understanding.