How can I create a Collection List in Webflow that pulls in content from different Collections? We're rebuilding our eCommerce stores and need to display products from multiple categories in one list. For example, the 'View All Products' page should show all products from all Collections, and the 'Products under £100' page should display products from multiple Collections filtered by price. Is there a way to achieve this? Here is my public share link: <LINK>

TL;DR
  • Combine products into a single Collection using categories/tags and add symbol/reference fields for distinction.
  • Add multiple Collection Lists on the same page and filter them to display products under £100.
  • Use custom code or Webflow’s CMS API for advanced solutions, considering technical proficiency requirements.

In Webflow, creating a Collection List that combines content from multiple Collections is not directly supported, but you can use workarounds to achieve the desired effect. Here's how to display products from multiple categories on a single page:

1. Combine Collections into a Single Collection

  • Assess if you can consolidate your products into a single Collection within Webflow by using categories or tags to differentiate between them. 
  • Add a new symbol field or reference field in the combined Collection to categorize your products like “Type” or “Category.”

2. Create Separate Collection Lists for Each Category

  • Add multiple Collection Lists on the same page to pull data from each Collection separately.
  • Stack or align these Collection Lists together on the page to visually appear as a single list.

3. Use Filters to Display Products Under £100

  • For each Collection List you've added, set a filter to only display products under £100. This can be done by choosing a price field and setting the filter to under '100.'

4. Use Custom Code to Simulate Filtering

  • Use JavaScript or CMS API to loop through multiple collections and append items manually. However, Webflow does not support this internally, and you should use it cautiously as it requires technical proficiency.

5. Review CMS API Usage

  • If you require more dynamic content loading, consider using Webflow’s CMS API to fetch items from multiple collections on a different platform. This is an advanced solution, often involving external hosting or additional services.

Summary

Creating a unified Collection List displaying products from multiple Collections requires workarounds like using multiple Collection Lists together or combining Collections into one with defined categories. Directly achieving this within Webflow is not natively supported without custom code or third-party services. Always ensure the data is consistently updated for accurate display.

Rate this answer

Other Webflow Questions