How to filter Webflow collection lists with minimal effort

March 30, 2022

Webflow is a flexible and versatile website builder. It provides no-code solutions to all the major functionalities that are essential to building a fully-featured website. As it simplifies the mechanism of filtering of a particular site, anyone can easily filter and limit the items in the collection list. Do you have a clear concept of how to filter Webflow collection lists? If so, you’re genuinely a Webflow expert. 

But if you’ve not acquired a good command of it, you can still become confident as it takes little time to learn. You don’t need to break a sweat to get proficient in it.  Who will guide you to master it? To be honest, we’re here with practical guidelines to help you out. You can stay focused on the rest of the article to sharpen your Webflow collection list filtering skills. Let’s dive into the context!

Why is filtering important in Webflow?

Filtering is essential to sorting out a specific item from an abundance of options. Through filtering, you can find the exact things that you’re looking for within a short time. But if you search for it manually, you might spend hours if there is enormous data. Sometimes, you may skip the actual post unintentionally. 

To illustrate, you have published hundreds of blog posts on your website. Now you want to edit a specific post that you published long ago. How do you sort it out? You need to scroll down and check the posts one by one manually. Is it not time consuming? Of course it is! There is no need to conduct the inquiry manually. Rather, you can reach out to the filter method to search for the post. It will bring you the exact post at once. 

How to filter Webflow collection lists?

If you have a colossal collection list for a collection, you will basically see the topper items. The collection will not show you all the items that you’ve assorted. How do you configure the settings to see all the elements? In this case, you need to apply the filtering process to see everything you want. How to filter Webflow collection lists? To get the most reasonable and structured answer, you may look at the below. 

We feel delighted to announce that we now provide a full-fledged Webflow development service worldwide. We will conduct all the major tasks that are indispensable for running a website with optimal comfort. You're asked to hand your next project over to us to get everything working well. 

Go to collection list settings:

In order to filter Webflow collection lists, you need to go to the collection list settings first. You will find the collection list setting option in the Element settings panel. Click on the collection list option under the CMS category.

how to filter webflow collection lists

Then a setting panel  will pop up with several fields on the right side of the page. Scroll down the page and find the Filters option. 

Webflow filtering

Add filters to a list:

Once you’ve found the filter option, you need to click on the plus sign. Now you’re set to add filters to a list. You need to select the field you want to filter by in the dropdown. In the second field, you have to choose a rule. If needed, you have to specify a value and finally click on the save button. 

Keep in mind that Webflow filters allow you to show specific collections of items in the list that match the filters you create. You can add as many filters as you want. All of your created filters will be combined by an AND operation in the Webflow source code. But Webflow will not allow you to apply multiple fields to the same collection field.

Add a filter to collection lists

Delete filters:

You’ve sorted out the requisite items using the previously created filters. Now you want to remove them. Can you do that? Yes, Webflow will allow you to delete the filters if they are not in use. 

By removing the old filters, you can create more handy filters from scratch. To delete filters, you need to click on the trash can icon. Next to each filter, you will find the icons that will let you make all the filters disappear. 

Show featured items only:

Do you want to show featured items only to the previously created filters? Well, Webflow will allow you to do so. Suppose you want to add, create, and style a "blog posts" collection list. So, you need to add filters first in the Settings panel. 

From the first dropdown, you need to select the "Featured" switch field then. In the second dropdown, you need to choose "is on". Finally, click on the save button to show featured items only to the filters. 

Hide the current item:

You can also exclude or hide certain items from the list. To exclude the current collection items, you need to add, create, and style a "blog posts" collection list like before. In the Settings panel, simply add a filter to do the rest of the work precisely.

Now select the certain collection name from the first dropdown and choose "is not" in the second dropdown menu. Once you complete this step, you will see a field that shows the "current collection item." Then click the Save button to get your current items hidden.

Show related content:

If you want to display the related content of a specific blog post, you can use the filter method. This time, you have to set the filter differently. You can configure the filter to display all the blog posts written by an author or those that belong to the same category. Let’s see how to use a filter to only show the blog posts that are related to a particular author.

To do so, again add, create, and style a "blog posts" collection list. Then add a filter. To find the related posts, you need to select the reference field for your authors from the first dropdown. Then choose the "Equals" option in the second dropdown. Also, choose "current author" in the third field and finally click on the "Save" button.

Frequently asked questions:

Filtering is a crucial task for creating a functional website. Since the invention of Webflow, people around the world have been asking  lots of questions about its filtering method. In this section, we’re going to respond to some of them. 

How do I sort the CMS collection in Webflow?

In Weblfow, you can easily sort the CMS collection by numbers. To do so, select your collection list and open the Element settings panel. Then click the plus button under Sort order and choose your new field from the new first dropdown.

How do I change the order of blog posts in Webflow?

If you want to change the order of blog posts on your Webflow website, you need to select the dynamic list first. Then you have to go to the settings tab and scroll to the sort order panel. Set to "Published On, Newest to Oldest."

How do I arrange products in Webflow?

In order to arrange products on your Webflow e-commerce site, you need to select your collection in the initial period. Then you have to open the Element settings panel. After that, click the plus button under Sort order. Finally, choose your new field from the first dropdown.

What framework does Webflow use?

Actually, Webflow uses its own proprietary framework. It doesn’t combine any third-party frameworks like other standout web builders. Its self-dependency feature makes it highly popular. 

How do I edit CMS Webflow?

To edit CMS in Webflow, you need to visit the Editor from the Designer or Project Settings option. Click the direct edit link and check out the page from the page-specific control. Always ensure you are in the Edit mode when you’re editing CMS in Webflow.

Final words:

If you’re going to build a giant website, you need to carry out immense chores. You need to create massive collection lists. You need to add countless blog posts. With the assortment of huge items, it will be difficult to sort out the exact item without the help of the filtering option. Hence, it’s essential for you to know how the filter method works. Do you know how to filter Webflow collection lists?

We hope you know and will never struggle with filtering items from the collection, as you’ve learned the most effective method here. Now it’s your turn to apply the knowledge properly to save your time and effort. Try to stay updated with the Webflow’s latest changes; otherwise, you may face barriers in the near future.