The Commerce site I'm working on (my first Craft project) will have a product listing page with filters. These will function as you would expect, but clicking a filter name will link to another version of the product listing page with another set of products, as opposed to updating the page via AJAX. I'm doing the content modeling now and am wondering if Craft categories are the best way to structure this or if there is a better way. I see it working somewhat like the Patagonia product page (click through the categories toward the top of the sidebar and note the URI change). However, unless there's an advantage to doing otherwise, I was just going to use categories for both of the filter sets below. Patagonia uses query string parameters when filtering by sport, whereas this site would have a unique slug(s) for each combination of filters.
Here's what the filters look like. A checkbox or some other visual indication would be given when a filter is selected:
Product Categories
- Category 1 (slug:
category-1
) - Category 2
- Category 3
- New Products
Shop by Use
- Use A (slug:
use-a
) - Use B
- Use C
- Use D
The selection options are:
- Only one Product Category can be selected at a time (choosing another deselects the previous selection), but a selection is not required.
- Only one Use can be checked at a time (choosing another deselects the previous selection), but a selection is not required.
- A selected filter can be unselected by clicking it.
- With the Product Category and Use options unselected, a page with ALL products is displayed.
A few more notes:
- Every product will belong to at least one Product Category but can belong to multiple.
- Every product has at least one Use and most have multiple.
- 'New Products' is a unique category that would ideally expire based on a date chosen when adding a product.
- I was picturing the URIs being something like the following:
- Category selected:
domain.com/products/category-1
- Use selected:
domain.com/products/use-a
- Category and Use selected:
domain.com/products/category-1/use-a
ordomain.com/products/category-1-use-a
- Category selected:
Questions
- Are categories the best tool for this job? If not, what would work better? If so:
- Would it make sense for Product Categories and Shop by Use to be their own category groups?
- Creating category pages is simple enough, but I'm not sure how best to create a page that represents a combination of categories / selected filters (e.g. Category 2 + Use A). I know I can use
relatedTo
to list products from multiple categories, but what is the best Craft element to use as a container for these pages? This answer was helpful, but it's not quite the same (for one thing, it's not Commerce-specific; it refers to products but I believe they are just standard channel entries). Should the combined-category pages be in their own channel? - New Products: I'm thinking this should be a static link, possibly to a single (
/products/new
) that lists products whose "newness" has not expired. Is there a better way?
I'm probably overthinking this! I mainly want to know if I'm heading in the right direction.