CMS Filter Menu

Design help CMS
1

Hi Everyone,

We are new to webflow and finding our feet and come across a sticking point. Hopefully you can help us.

We are creating a shop and on the left hand side of the page we have a filter menu. The menu contains two sections:

Products (menu of different brands (Canon, Nikon, Sony)
Accessories (menu of accessories for the different brands)

Currently at the moment we have configured our categories to include product categories (canon products, Nikon products, Sony products) and accessory categories (canon accessories, Nikon accessories, Sony accessories), so 6 different categories. This seems long winded and our current menu uses explicit URLS to display results.

What we are trying to do is have all products linked to the categories of Canon, Nikon, Sony even if they are a product or an accessory. To clarify if a product or accessory, this is added when creating a product. Below is an example menu:

PRODUCT
Canon
Nikon
Sony

ACCESSORIES
Canon
Nikon
Sony

How do we get just the 3 categories displayed as our menu? When we create a custom field on the product to select product or accessory, and create a reference on the category, when we try to add the category as a menu item and put a condition (to display either product or accessory) the text disappears. The only way the menu displays is you choose to display the category details not a referenced field.

Sorry its really difficult to describe, but hopefully this makes sense. Maybe its not possible.

Here is my public share link: https://preview.webflow.com/preview/berenstargh?utm_medium=preview_link&utm_source=designer&utm_content=berenstargh&preview=1aaad6d68b36b7b86677dc3a44a57741&pageId=5ed01e1b9b612b580aaca0cf&itemId=5ed01e1b9b612bbde1aca1d8&mode=preview

Hopefully you can help.

Thanks,

Steve

2

Hi Steve,

Sorry, I’ve not used the eCommerce version of Webflow yet but in the standard version to get the 3 categories to display as your menu I believe you need to to create a CMS Collection of the categories(maybe named Product Categories) and then add this CMS Collection as a multi-reference field in the product.

Then add the CMS Collection List ‘Name’ to the page? I’d be interested to hear how you move forward with this as I understand the eCommerce version handle this slightly differently.

3

Hi Ace,

Thank you for your reply. Actually im not sure Webflow supports this function now.

Ill be in contact.

Thanks,

Steve

4

Hi @Ace,

So what we were trying to do was create a 1 to many relationship to a category. Then the menu we create on the web page to filter out what products to display. I dont think this is supported.

Thanks,

Steve

5

Hi @InfinityX,

I use Mixitup, tutorial here How to add dynamic filtering and sorting to your Webflow websites | Webflow Blog to deploy dynamic filtering to posts using multi-ref categories. It’s not the easiest but works nicely.

1 Like
6

You could also look at these guys, they have a few CMS filtering solutions that are simpler to implement than Mix it up. It may be useful! https://www.finsweet.com

1 Like
7

@InfinityX

Hey!

We build an easier to implement solution for more complex filtering options and deliver support if needed No Code Flow. Every searchable item is a Webflow CMS item. Every visual aspect (including states) can be modified in the Webflow designer. We build it as a cloneable component with a little video tutorial to implement it – should take you around 10-15 minutes to get started.

:sparkles: A demo can be seen here → https://ncf-filter-styled.webflow.io/

Filter Vid