The basics of filter options

đź“– Each filter tree allows you to create several filter options. The filter options inside a filter tree can be customized by their appearances, arrangements, and other advanced settings. The values of each filter option are adjusted based on the products under the displayed collections.

On this page

What is a filter option?

A filter option is a category-specific selectable filter that is based on product attributes and Metafields, offering a variety of choices for your filter tree creation. A strategized selection and arrangement of filter options for a specific collection will greatly optimize online shoppers’ experience and reduce bounce rates.

Our app allows you to create up to:

  • 30 filter options in one filter tree
  • 1500 filter values in each filter option

For example, my sweater collection will have filter options such as size, material, price, and color; the color filter option will include red, green, and blue filter values.

Our app offers you several formal filter option types: collection, vendor, color, size, product type, price, variant’s price, percent sale, inventory location, review rating, stock status, weight, tag, and multi-level tag.

Moreover, our app enables you to set up advanced filter options from your Metafields. In the feature’s configuration, you can set up filter options in the form of range sliders depending on specific product attributes, tags, and Metafields.

Settings of filter options

Each filter option will contain a combination of the following general and advanced settings.

Note: When setting up a new filter option, the preview of the filter option will be presented on the right block. This tool is incredibly useful as it constantly updates new settings changes as you are configuring the filter option.

Depending on the filter option that you want to set up, the following general settings will show up:

  • Option label: the label for the filter option on your storefront.
  • Option display: how the values of that filter option will be displayed. They can be displayed in same-level collections, multi-level collections, lists, boxes, swatches, or ranges.
  • Option select: you choose if your customers can select single or multiple values at once in that particular filter option.
  • Option values: you might want to either present all values of a filter option or manually pick particular values to present on your storefront.

To rearrange those option values

  1. In the drop-down of Option values, select Manual.
  2. In the drop-down of Manual values, choose the desired option values.
  3. Drag and drop them to create your desired order.
  4. Uncheck the Sort manual value box in Advanced Settings > Save. (disable auto-sorting manual values feature)
  5. Click Save on the Filter options page.

Some other conditional customization options

  • Keep the filter option unchanged (collection filter option): When a collection is selected from the collection filter option, the customer will be redirected to that collection’s page. If this setting is disabled, any collection that doesn’t satisfy the requirements of the selected collection will be hidden from the collection filter option. If enabled, all of the collections will be shown regardless of the current collection’s requirements.
  • Display “All” collection (collection filter option): when this feature is enabled, your customer will have the option to display products from all collections when filtering products by collection.
  • Swatch: when setting up “title”, “color”, “height”, “size”, “tag”, and Metafield filter options, you can decide their swatch style as grid view or list view.
  • Excluded values: when setting up “collection”, “product type”, “location”, “vendor”, “tag” and Metafield filter options, you might want to exclude certain values to help customers narrow down their product search more effectively.
  • Using prefix: this setting will show up whenever you set up a “Tag” filter option.

Note: When setting up a "Stock Status" filter option, it is worth noting that a product, which:

  • has a specific variant matched with all filter values selected by customers that is out of stock;
  • has other variants that are in stock,

will still be displayed in the product list when your customers check the "In Stock" box in the provided filter tree. This is an intentional design to help increase the conversion rate.

Filter option's advanced settings

  • Display tooltip: this feature allows you to provide descriptions or explanations for filter options that you worry your customers might misunderstand.
  • Display all values in uppercase form: you might want to display filter values in uppercase.
  • Sort manual value: you can determine whether the filter values are displayed alphabetically or by item count. (when you choose manual in Option values)
  • Sort Type (Alphabetical/Product Number): the feature can help you automatically display filter values alphabetically or by item count.
  • Show more type (Scrollbar/ Display all values/View more/ View more with Scrollbar): you might want to use an inline scrollable filter menu, a long list of all available values, or a truncated filter with the “View more” option.
  • Use AND condition: this setting will be provided when setting up “tag” and “multi-level tags” filter options. By enabling this setting, only the products that have all selected tags matched are displayed in filtered results.

  • Collapse on PC/Mobile: you can determine whether the filter option is closed by default or requires users to click it to see its values.

    Show search box on PC/Mobile: when setting up a Vertical filter option, enabling this feature means that your customer will be provided a search box in the corresponding filter on your storefront to search for a specific filter value of the filter option.

The "Show search box” feature is not available when:

  • Setting up a "multi-level tag" filter option.
  • Setting up a "collection" filter option and selecting "Multi-level collections" in the drop-down of Option display.

How to configure filter options

To enable and disable a filter option in a filter tree

  1. From the app’s dashboard, go to Filter > Manage filter trees.
  2. Click the filter tree that you want to customize its filter options.
  3. Toggle the Status button of the filter option that you want to enable to disable to either on or off.
  4. Click Save on the Filter options page.

Your filter options show on the storefront in the same order they appear in the control panel.

To rearrange those filter options

  1. From the app’s dashboard, go to Filter  > Manage filter trees.
  2. Click the filter tree that you want to rearrange its filter options.
  3. Drag and drop those filter options to arrange them in your desired order.
  4. Click Save on the Filter options page.

To delete a filter option

  1. From the app’s dashboard, go to Filter > Manage filter trees.
  2. Click the filter tree that you want to delete one of its filter options.
  3. Click the trash icon of the filter option that you want to remove. Keep in mind that deleted filter options cannot be recovered.
  4. Click Save on the Filter options page.


If you have any questions or need further assistance, please do not hesitate to reach out to our dedicated support team at support@boostcommerce.net.