Build custom filter for restaurant menu

Hi- I run the website www.thewanderingwaiter.com

A filter on my website is broken but I think it’s best to custom build the filter from scratch to make it work how I want it to work.

The restaurant menu is here: https://thewanderingwaiter.com/profile/leonie-gluck/

You can see 4 products and 2 filters on the left:
1) Menu filter – This works correctly
2) Filter Tags – this does not work. 2 people have tried to fix it but could not get it to work so please take it out and we can build from scratch

This new filter should look the same but be called “Dietary Requirements”. I want customers to be able to filter the menu by “Product Tags” (These product tags can be viewed in this link but I will give WP-admin access after I have accepted a proposal: https://thewanderingwaiter.com/wp-admin/edit-tags.php?taxonomy=product_tag&post_type=product.


Below are the 5 products and the products tags on each product:
1) Tomato Soup (Product tags: Halal, vegetarian)
2) Spaghetti Bolognase (Product tags: Egg Free, Halal)
3) Italian Salad (Product tags: Nut Free, vegan, Vegetarian)
4) Cheese pizza (Product tags: Nut Free)


So…in the filter if I click and highlight the tag called “Nut Free” then the filter should take out all the products that do not have this product tag in the menu. The menu should therefore only show 2 products – Italian Salad and Cheese pizza. Another example, in the filter if I click on or highlight the tag called “Vegetarian” then the menu should only show 2 products – Tomato Soup and Italian Salad. If I untick the tags then all the products should show on the menu again. This should work automatically like the menu Section 1 works automatically and it does not need to reload the page.


You can see how the tags highlight on the demo theme here: http://azexo.com/foodpicky/restaurants/

Thanks,
Jamie