Hi everyone,
I’m working on a Shopify OS 2.0 store with a large catalog (auto parts).
On collection pages, the standard Shopify sidebar filters are too limited for my needs. They only display flat filter options, whereas I need a multi-level / hierarchical filter structure, for example:
2 Wheeler → Electrical Parts → Swithces
Similar to how many automotive or electronics stores allow users to expand parent categories and then select child options.
My questions are:
-
Is it possible to configure hierarchical / nested filters using native Shopify OS 2.0 filters (Search & Discovery, metafields, etc.)?
-
If not, is theme customization / custom Liquid + JS the recommended approach?
-
Are there any Shopify-recommended apps or best practices for this use case?
I want to avoid poor UX and SEO issues, so I’d appreciate guidance on the most future-proof approach.
Thanks in advance!
Not sure how your data is set up.
Some themes also do it better then others.
Most modern themes update product list interactively, so when you make selection you do not need to click “filter”, products are reloaded automatically.
With this, system updates other filters to include only values which are available on this new set of products.
Say, you have 3 metafields on your products “Make”, “Model” and “Year”
If you select, say “Ford” in “Make”, “Model” would drop “Camaro” and “Wrangler”, but keep “Mustang”.
If you sort these filters like this, it is possible to add a small CSS code to only show filter if previous one has selection made. This will give you some type of a hierarchy.
Kinda like this:
I had the same issue on an auto-parts store. Native OS 2.0 filters can’t build hierarchical structure, no matter how much you customize metafields. We used a Liquid + JS combo and got exactly what we needed. It’s not too complicated if your metafields are already structured well.