Adding product filtering
You've got shop pages featuring products, categories, and sort options. You want buyers to be able to filter the shop's products. Product filtering allows buyers to narrow down the products a merchant has published to the channel, based on specific attributes. This can help buyers discover products that are relevant to their preferences.
In this tutorial, you'll add filtering functionality to products. You'll set up filters by price range and availability. Price range options will be in intervals of $49 and availability options will be "In stock" and "Out of stock". However, you can follow a similar structure to provide filtering by other product attributes.
What you'll learn
Anchor link to section titled "What you'll learn"After finishing this tutorial, you'll know how to add product filtering functionality to shop pages.
Requirements
Anchor link to section titled "Requirements"- You've completed the tutorial for adding product sort.
Update shop page queries
Anchor link to section titled "Update shop page queries"Update the shop query to retrieve the shop's currencyCode. Because the data returned from the query is already being added to the Shop component's state, you'll use it to pass the currencyCode parameter into the ProductSection component.
Your merchant shop page might now look something the following:
Learn how to add a product description page to enable buyers to view product details on your marketplace.
Share feedback on Marketplace Kit.