Custom filter options
Using metafields, Story theme can display custom filter types
Build your own custom filter options and assign them to various products. If your custom filters are colors, Story theme will automatically create color swatches for customers to filter by:
Band color and Face color are custom filter options
Begin by creating a basic text metafield in your Shopify Settings:
Start in your Shopify Admin -> Settings and choose Metafields from the left panel and then click on Products (click images to zoom):
.png?alt=media&token=ded139b8-e606-4af6-9467-7df5631a4956)
Create new Product metafield
.png?alt=media&token=4279b446-4060-4c41-ae38-1ed389fc302f)
Choose Add definition
- Provide a Name for your metafield. In our example, we've used Band color.
- The default Namespace and key can be used. No modifications are needed.
- Choose Text, Single line text for the Content type.
- No validation is required.
Example of Band color metafield definition
Save your new definition.
Now that your metafield has been defined, we simply start adding Band colors to each of our products.
The next step is to edit any of your products in the Shopify Admin -> Products and add a color to the Band color option under Metafields. Scroll to the bottom of the product setup page:
Coffee has been assigned as the color for this product's Band color
Populate the Band color metafield option for all products that apply with their color.
The final step is to ensure your metafield has been added to the Collection and search filters in the Navigation admin.
Use the Add filters option and select your metafield(s) to include as filter options:
Shopify Admin under Navigaiton
When the pop-up appears, check your metafields:
Band color is checked and will appear in the Collection sidebar as a filter option
Last modified 1mo ago