Filtering Products with Metafields in Shopify

Managing an eCommerce website often requires organizing a vast inventory of products in a way that benefits both your customers and search engines. When your site hosts a large number of items, it's crucial to provide users with easy-to-use tools to help them quickly locate what they're after. This is where product filters play a vital role. A product filter enhances the user experience by streamlining on-site search and filtering, encouraging users to stay on your website instead of returning to search engines to start over. It's a feature that can greatly improve site navigation.

Shopify Metafields offer a versatile way to include custom data for your store's products, variants, collections, customers, and more. They allow you to go beyond Shopify's default capabilities, enabling you to store extra details that aren’t covered by the platform’s standard attributes, enhancing the flexibility and functionality of your store.

In this comprehensive guide, we'll explore the concept of metafields and demonstrate how to set up a product filter using metafields in your store.

What Are Metafields?

Metafields in Shopify are custom fields that allow you to add extra information to your store that isn't typically available in the Shopify admin. They enable you to enhance your store's functionality and appearance by adding additional details to products. Metafields can be used for various purposes, including internal tracking or displaying specialized information on your storefront, such as product specification, warranty policy, and highlighting special features.

Consider an electronics store that provides detailed information about washing machines. In addition to displaying the standard type, the store could also use metafields to indicate more detailed specifications of the products that meet customers’ demands. These extra fields, such as Wash load, Dry load, and Warranty policy, are examples of metafields in action.

Shopify Product and Variant Metafields

Metafields can be associated with both products and variants. Product metafields allow merchants to add specific categories or details to a product page, displaying additional information that isn't part of Shopify's default fields. For example, if you're selling apparel, you might want to add extra information like fabric type or care instructions.

Variant metafields, on the other hand, enable more specific customization options at the variant level. This could include attributes like size, pattern types, or fabric, allowing you to create richer product descriptions and variant options for customers.

How to Create Product Metafields in Shopify

1. Navigate to your Shopify admin panel.
2. In the lower-left corner, select ‘Settings’.
3. A menu will appear on the left side. Choose ‘Metafields’.
4. Decide whether you're working with a product or variant metafield.
5. You'll now see a list of existing metafields. To add a new one, click on ‘Add definition’ located in the upper-right corner.
6. Enter the necessary details, including the metafield name and description, and choose metafield type, such as Text, Number, JSON, etc.
7. Finally, click ‘Save’.

Use Cases of Product Filters by Metafields in Shopify

Add Range Slider Filters for Products Using Metafields

Range sliders are a type of filter that allows customers to search for products within a specific range of values, such as product dimensions or numeric attributes. For example, you could use a range slider to filter products based on length, height, or a custom numeric attribute like a range between 0 and 9.99.

Year Make Model Search for Vehicle Parts

For stores that sell vehicle parts, the Year/Make/Model (YMM) search tool is incredibly useful. It allows customers to search for products by selecting the year, make, and model of their vehicle, helping them find the exact parts they need. YMM search is especially valuable for stores selling vehicle components like tires, wheels, bikes, and boats.

You can create dropdowns for categories such as Year, Make, Model, and Engine, making it easy for customers to navigate your store and find compatible products efficiently.

How to Create Product Filters Using Metafields

Metafield filters are particularly useful for creating unique filters that match your product catalog. For example, if you sell wine, you could create a custom "Alcohol by volume" metafield filter. Visual metafield filters, like sliders, can make it easier for customers to navigate your site and find the right products quickly.

Before using metafields as filters, please make sure you add metafields to your product in Shopify admin.

Step 1. Allow app to index metafields or custom fields:

1. From the admin dashboard, click on the settings/gear icon at the bottom of the sidebar.
2. Click the Search Index tab, then scroll down to the Index card.
3. Turn off the Omit Metafield option.

Step 2. Add metafields or custom fields to search field:

1. Above the Index card, click the 'Add Metafield to search fields' or 'Add variant metafield to search field' button.
2. Specify the namespace and key of the field. Example: specification.ram where specification is the namespace and ram is the key.
3. Select value data format type as Text or Number. Choosing the Number value format enables the setup of range sliders in the filter, while Text allows for multiple values per Metafield or Custom Field. If you want to add a range slider filter based on Metafield in Settings/Search index, please select metafield type as Number.
4. Click Sync to reindex the product data.

Step 3. Add metafield or custom field filter:

1. After the reindexing process is completed, click on Filters on the vertical menu and select a filter group where you wish to create a new filter.
2. Click Add filter or click on the current Metafield filter value. A window will pop up to let you create/edit the filter.
3. In the Option type, select the metafields you added to the search fields.