How can a collection list in Webflow be sorted by one of its reference fields?

Published on
September 22, 2023

To sort a collection list in Webflow by one of its reference fields, you can follow these steps:

  1. Open your Webflow project and navigate to the page where the collection list is located.
  2. Select the collection list element that you want to sort.
  3. In the right panel, go to the Settings tab.
  4. Scroll down to the Sort and Filter section.
  5. Click on the "Add Field" button to choose which reference field you want to sort by.
  6. Select the reference field from the dropdown menu.
  7. Choose the order in which you want the collection list to be sorted - either ascending or descending.
  8. Save your changes.

By following these steps, the collection list will be sorted according to the selected reference field. The items will be displayed in the specified order on your website.

Note: Sorting a collection list by a reference field requires that the reference fields are properly set up in your collection settings. Make sure that the referenced field is properly linked to the collection list item, and that the reference field data is filled in correctly for each item in the collection.

Example:

Let's say you have a collection of blog posts, and each post contains a reference field called "Category". You can use this field to sort the collection list by category.

  1. Open the page with the collection list of blog posts.
  2. Select the collection list element.
  3. In the Settings tab, go to the Sort and Filter section.
  4. Click on "Add Field" and choose "Category" from the reference field dropdown.
  5. Choose the desired sorting order, such as ascending.
  6. Save your changes.
  7. Preview or publish your site to see the sorted collection list.

Now, the collection list will display the blog posts sorted by the "Category" field, making it easier for visitors to navigate and find relevant content.

Additional Questions:

  • How do I set up reference fields in Webflow?
  • Can I have multiple sorting criteria for a collection list in Webflow?
  • Is it possible to filter a collection list based on a reference field in Webflow?