I was going to try and approach a store navigation like this one: http://www.asos.com/Men/Jeans/Cat/pgecategory.aspx?cid=4208 (On the left, "Refine").

 

I was wondering how hard this would be?

Any tips?

Any tutorials?

 

Thanks.

I found out it was called "Faceted filtering" or "Faceted search/navigation"

 

Can't find any tutorials or scripts though.

Its unlikely there will be many tutorials out there regarding this. It's not often you see this kind of filtering to be honest as most shopping carts take the easiest route for category pages. The way it works is fairly simple though:

 

You have a list of attributes that are global (attribute groups), such as brand, colour and so on, and for each of these you have every possible attribute that all your products will want. The job of the attribute group table is to simply group your attributes so they show correctly for each brand, colour etc. They don't actually play any part in the filtering as such

Then you assign each attribute a product has to the product using a has and belongs to many link table, that joins the two together

Then using the filters, you filter your link table by the attribute ids, and work out what products remain. The only option I can see there that isn't an attribute is the price, and of course that's just a case of filtering the products remaining from the link table by those that are between the two prices

Isn't that the long way around?

 

If I understand your post correctly you are saying Create Category -> Create Attributes -> Create Products and tick appropriate Attributes

 

The problem with that is you have to create every possible attribute before you create the products that will inhabit them. If I get a new product in, a Yellow jacket, but I never created a Yellow attribute I'm going to have to make that before I can properly add the jacket.

 

The simpler method (From a UX standpoint, perhaps not a code standpoint) would be to create the categories and leave them open ended. During product creation you would just enter text. The filter then just lists all found Colour attributes on any given set of products and lets you filter them.

 

The downside is spelling and formatting mistakes, but that can be alleviated. Everything gets normalised and have a little drop down dialogue showing existing attributes that match what is being entered.

Isn't that the long way around?

 

If I understand your post correctly you are saying Create Category -> Create Attributes -> Create Products and tick appropriate Attributes

 

The problem with that is you have to create every possible attribute before you create the products that will inhabit them. If I get a new product in, a Yellow jacket, but I never created a Yellow attribute I'm going to have to make that before I can properly add the jacket.

 

The simpler method (From a UX standpoint, perhaps not a code standpoint) would be to create the categories and leave them open ended. During product creation you would just enter text. The filter then just lists all found Colour attributes on any given set of products and lets you filter them.

 

The downside is spelling and formatting mistakes, but that can be alleviated. Everything gets normalised and have a little drop down dialogue showing existing attributes that match what is being entered.

Sure I wasn't saying you need to create all your attributes at once, merely that you need to have an attribute to add. You could add them on the product too sure, but I was trying to keep it as simple as possible for the OP as they haven't ever done this before. Small steps

 

EDIT: its worth noting that for your method you would need to be able to enter an attributes group in the product too, unless you made those beforehand, although personally I would stick to creating the groups outside of the products

Edited July 20, 201115 yr by Jay Gilford