Filters allow you to find the necessary records in collections. To do this, you need to set one or more filters according to conditions that complement each other.

Main Elements

Let's take a closer look at the filter panel:

1. Filter icon The filter modal opens when you click on the filter icon. If a filter is applied, a counter is displayed with the number of active filters (including those inside groups).
2. Filter conditions AND - all conditions must be met; OR - one of the conditions must be met; By default, the AND condition is selected. You can switch it and immediately see changes in the filter results.
3. Filter reset button Clicking on clear all resets all filters.
4. Modal close button Clicking on X closes the modal.
5. Filter group In CMS, you can create filter groups. This is used when some filters need to be collected with a different condition i.e not like in the modal header. There can be many groups, but a group cannot be nested in another group.
6. Filter list All added filters that are not in a group.
7. Adding new filters The Add filter button allows you to add new filter lines.

Filter state

Filters can be in the following states:

1. Active Filters that have been added, configured, and activated by clicking ✓. Such filters participate in filtering.

2. Inactive Filters that have been added. But the ✓ button was not pressed. The name of such a filter is colored in gray and it lacks a filter work description (for example contain "Urban Outfitters"). Such a filter is displayed in the list, but does not participate in filtering. You can always open, configure, and activate such filters. This might be useful: when there is a list of necessary filters and you first add them and only then configure them.

3. Editing A filter goes into the editing state when adding a new filter or when clicking on an existing one. The editing screen consists of 3 parts: input (depending on the filtering method), control buttons (you can delete the filter or save), filtering methods of the selected field (see Filtering methods ). Only one filter can be in editing mode at a time.

   

Context Menu

To call the context menu, you need to click on the grip icon. There are 3 options: Create a group, duplicate, and delete.

When duplicating a filter, the duplicate immediately opens in edit mode.

<aside> ⚠️ Filters inside a group only have two options: duplication and deletion. This means that a group cannot be created within a group.

</aside>

Adding Filters

Our task: to find Urban Outfitters products that are on sale.

1. Let's add the first filter condition. Click on add filter

   

2. Select brands from the list of fields.

   

3. After adding a field, it opens in edit mode When adding a field, the first filter method in the list is selected. In our case, it's contain (see Filtering methods ). As long as the input is empty or an option is not selected, the ✓ button is not active. Until it is pressed, the filter does not participate in the search.

   

4. Select Urban Outfitters from the dropdown list of brands. The default filter method is contain which is what we need. Click on ✓.

   

5. The first field has been added. We can see that only Urban Outfitters products are left in the list. All that's left is to add another filter for discounted products.

   

6. Let's click on Add filter and select Sale from the list of fields.

   

7. The Boolean field type only has True, False methods. It doesn't have input or option selection. By default, the first method True is selected. The ✓ button is already active. We need the discount to be enabled. Click on ✓ and save the filter.

   

8. Done! We have filtered out products that have a discount and filtered by the required brand.

   

Creating group

Task: Find discounted products from the Urban Outfitters and Fatboy brands. Since we have a conflict of AND and OR conditions, we will use groups in filters. We need to assemble a scheme - (Urban Outfitters or Fatboy) and sale.

1. Let's start by creating a group for brand filters. To do this, we need to select an existing filter and make it a group through the context menu. We already have a filter for Urban Outfitters. Click on the icon to call the context menu.

   

2. In the context menu, select Group.

   

3. Group is created. Note: when a group is created, it is created with the and condition. We switch it to or because we want to find discounted products from two brands.

   

4. Now we need to add a new filter for the Fatboys brand. We can add a new filter through the add filter button or by duplicating an existing filter. Let's try the second option. To do this, open the context menu and select dublicate.

   

5. The filter is duplicated. Click on it to edit the filter.

   

6. The filter has switched to edit mode. Leave contain, Select the Fatboy brand and click ✓.

   

7. Done! Only discounted products and brands Fatboy and Urban Outfitters are displayed in the collection.

   

Edge cases

1. If you delete the last record in a group, the group does not get deleted. You can add new filters to it. You can delete a group by clicking the trash can icon in the group header.

2. If during the addition of a new filter you do not click on ✓ and close the modal, add a new filter or open editing of another one, the filter will remain inactive.

3. If during the editing of an active filter you do not click on ✓ and close the modal, add a new filter or open editing of another one, the filter will remain active, but will not save changes.

4. If no records are found as a result of filtering, we see the following message.

   

<aside> 🔖 Read more on this topic ——————————— Filtering methods Sorting Sorting methods Visibility

</aside>

• Getting started

• Scheme builder

• Collections

• View settings

  Filter

  Filtering methods

  Sorting

  Sorting methods

  Visibility

• Content editor

• Navigation

• Media

• Team

• API