How to create filter options by product options/vendor/product type
The most basic and recommended way to create filter options is by using Product Options/ Vendor/ Product Type, which are listed in the Product attributes.
Watch the tutorial to see how you can create, add and edit filters under Default filter tree, Search filter tree, and Custom filter tree.
Create filter options by Product options/Vendor/Product type
- From a filter tree, click Add a filter option button to show a dialog as follows:
- From Option type, choose your available Product options/Vendor/Product type
If your Product option has special characters, please reach out to firstname.lastname@example.org in order to find its proper name to use in creating filter option.
- Enter Option label: display name of the filter option on the front store.
- From Option type decide how the values display:
- Option display (types of filter option): List, Box, Range, and Swatch (See more).
- Option select: Allows customers to either choose one value or many values.
- Option values: Decide showing all values automatically or manually pick each value.
- Keep filter option unchanged (Extra option for Collection type). When this option enables, the current collection page will not reload if the user selects a filter option whose type is Collection.
- Prefix (Extra option for Tag). When this option enables, only tag values that matched the prefix value will show.
- Click Save and a new Filter option will be added to the Filter options table. Small tip: We support searching with the regex pattern. It can help to search the right terms if the data is too big or almost similar. For example, you manually add tags, you could search the tags that end with "ing" (inputing$) or start with "be" (input ^be)
For creating a filter option by Metafield, kindly refer to this article.
Manage filter options
- Change the order of filter options: You can drag & drop a filter option to any position in the table and the frontend will change respectively.
- Enable / Disable a filter option by toggling its Status button.