We’re building our largest eCommerce store yet using Webflow and the Shopify buy button.
What I’m having trouble with is working out the following…
We have multiple Collections for each product category, but we also have static pages that focus on the recipient or price range to make it easier for users to shop. For example a user might go right to the category they want, or they might decide to see what products are available in that price range.
In a little more detail we have Collections such as:
Driving
Flying
Dining
And static pages such as:
Under $100
Gifts for Men
Gifts for Women
How can I pull in items from multiple Collections that would fit under one of those static page categories? For example, how would I pull in every product under $100 from every Collection we’ve made?
I know I can filter a single Collection list, but how can I pull in multiple lists?
Hey @radicalrooster, looks like you have gone about the Collections wrong (or not the way I would do it). I went through each of your Category Templates and they are all using the same design. Ideally, whenever a Category shares a design, you should merge them into 1 collection. Then, use the a multi-reference collection to filter/sort them out.
The reason why we use multiple Collections is for the URL… If we had all our separate Collections merged into one, they’d all follow the same /[same collection]/[collection item name] url structure, which wouldn’t be ideal given the number of different product types we have.
Right now for example, our collections look like this:
If we were to merge them all into one big collection, it would look like: /all-products/product
I know URLs aren’t as important for SEO these days, but still I think it makes better sense (and to keep things organised) if our products were organised into categories. Plus our train products do have different templates and the others may do in the future.
Another reason we didn’t do this is because of the limit of Collection References we have. Our trains products for example use about 8 Collection Reference fields, and if we wanted to put all our products in one Collection, we’d need to add more filters such as Recipient, Occasion etc, all which wouldn’t fit into categories already close to the limit of Collection Reference fields.
If this is what you’re after, I can’t think of a solution.
I would arrange it as such:/products/british-pullman-... and if you want to group trains then it’ll be /categories/trains
This will allow you to mix and match products for selected product promotions without creating another Collection. e.g. You have a promotion going on that applies to British Pullman Train and Nascar. You can just create a new Category and reference the category for the selected products.
I realise you have a category page, but it is not being used as a template just as a filter.
You can filter by date, by promotion, by price ranges etc. without creating a new collection.
In regards to reference fields, I think you can reduce them further. For static informations, example: Price Range can be a Select dropdown instead in CMS. Same may be applied to Departure Dates as well.
I see what you mean, I think if we had a smaller, less filter-able range of products having everything in one Collection could work.
If we wanted to do it this way, we’d need the following number of Collection Reference fields, simply because a lot of products fall into more than one category. We can’t use Multi-Reference because our Mixitup filter can’t read Multi-Reference fields.
We’d need:
Departure date 1
Departure date 2
Departure date 3
Product Category
Product Price Range
Product Location
Produce Departure (for trains)
Product Destination (for trains)
Recipient 1
Recipient 2
Recipient 3
Occasion 1
Occasion 2
Occasion 3
Which is more than Webflow allow, and even the above limits each product to only being in three occasion filters and three recipient filters.
I think we’re facing three limitations:
Mixitup not being able to use Multi-Reference Fields
Webflow only allowing a maximum of 10 Reference Fields
Not having customisable URLs for Collections (e.g. they all share the same parent folder)
Okay, I’m sure you have tried and chose the best option for your products.
Anyway, if you want to pull multiple list, @Finsweet recently released a custom JS pack which allows you to combine multiple list. Note that you are limited to 20 collections in a page. F'in sweet CMS Library for Webflow!
As long as it is paginated, it’ll be fine because webflow will only load 1 page at a time. The CMS library i linked above has a load more function which lazy loads too.
I think for this one, we need to keep going as we’re already too far in…
However we have many more of these sites to build for different countries, so I may try your method of having one Collection for products that share the same template.
Yes, CMS Library is great for combining collections from different lists. Using our Combine component, you can combine as many different lists from different collections as you’d like. We built this specifically for filtering! Could be a solid solution for you!