Enhance Your Collection Pages with Storefront Filtering

Enhance Your Collection Pages with Storefront Filtering

Table of Contents:

1. Introduction
2. What is Storefront Filtering?
3. Benefits of Storefront Filtering
4. How to Enable Storefront Filtering in Showtime Theme
5. How to Enable Storefront Filtering in Pursuit Theme
6. How to Enable Storefront Filtering in Galleria Theme
7. Setting Up Filters in Showtime Theme
8. Adding Custom Meta Fields for Filters
9. Populating Custom Meta Fields for Products
10. Refreshing and Using Custom Filters
11. Conclusion

Introduction

Welcome to this tutorial on how to set up and enable storefront filtering on your collection pages in our themes. In this video, we will be focusing on the Showtime theme, but the process is similar in our other themes as well. Storefront filtering is a powerful feature that allows you to narrow down your product listings on collection pages based on different filters such as availability, price, brand, and more. By the end of this tutorial, you will have a clear understanding of how to enable and customize storefront filtering in your Shopify store.

What is Storefront Filtering?

Storefront filtering is a feature that appears on the left side of collection pages in our themes. It allows customers to easily narrow down large lists of products by applying different filters. These filters can include options like in-stock products only, price ranges, brands, colors, and more. When a filter is selected, the products on the collection page automatically update to show only the products that meet the selected criteria.

Benefits of Storefront Filtering

Storefront filtering offers several benefits for both store owners and customers. Firstly, it improves the user experience by making it easier for customers to find the exact products they are looking for. It eliminates the need for manual scrolling through long lists of products and saves time. Secondly, storefront filtering enhances the organization and aesthetics of your collection pages by presenting a clean and user-friendly interface. Lastly, by allowing customers to filter products based on their preferences, storefront filtering improves the chances of conversions and boosts sales.

How to Enable Storefront Filtering in Showtime Theme

To enable storefront filtering in the Showtime theme, follow these steps:

1. Go to the Shopify app store and download the free Shopify Search and Discovery app.
2. Install and enable the app on your store.
3. Open the theme customizer and navigate to a collection page.
4. Under the collection grid, enable the options for "show active filters" and "enable filter color swatches."
5. Choose how you want the filters to be displayed – in a sidebar, a drawer, or turned off completely.

How to Enable Storefront Filtering in Pursuit Theme

Enabling storefront filtering in the Pursuit theme is similar to the Showtime theme. Here's how you can do it:

1. Open the theme customizer and go to a collection page.
2. Under collection pages, select "storefront filtering" as the filtering method.
3. Adjust the display options for the filters according to your preference.

How to Enable Storefront Filtering in Galleria Theme

In the Galleria theme, the process of enabling storefront filtering is as follows:

1. Open the theme customizer and go to a collection page.
2. Choose "products" in the customization options.
3. Enable filtering and customize the display options for the filters.

Setting Up Filters in Showtime Theme

In the Showtime theme, you can set up different filters for your collection pages. Here's how:

1. Access the Shopify Search and Discovery app.
2. Click on "customize filters" either from the app or the left-hand menu.
3. Drag and drop the available filters in the desired position on the list.
4. You can add additional filters like product type, tags, or any custom meta fields.
5. Customize the filter options to match your product attributes and inventory.

Adding Custom Meta Fields for Filters

To create custom filters using meta fields, follow these steps:

1. Go to the app settings and select "custom data."
2. Create a new product meta field by providing a name, description, and type.
3. Save the meta field to have it available for use as a filter option.
4. Assign the custom meta field to relevant products by editing their details in the admin panel.

Populating Custom Meta Fields for Products

After creating custom meta fields, populate them for each product to enable filtering. Here's how:

1. Open the product page in the admin panel.
2. Fill in the values for the custom meta fields according to the product's attributes.
3. Save the changes to update the filter options available for that product.

Refreshing and Using Custom Filters

Custom filters will not appear on your collection page until there are products that match the filtering criteria. To use custom filters, follow these steps:

1. Visit the collection page where the filtered products should appear.
2. Select the desired custom filter, and the collection will refresh to show matching products.
3. Note that only applicable filters will be shown, depending on the products in that specific collection.

Conclusion

Congratulations! You have successfully learned how to set up and enable storefront filtering in your Shopify store. By utilizing storefront filtering, you can greatly enhance the user experience, improve the organization and aesthetics of your collection pages, and ultimately increase sales. Remember to explore the various customization options available in each theme to tailor the filtering system to your specific needs. If you have any further questions or need assistance, please reach out to our support team. Thank you for using our themes, and have a great day!

Highlights:

• Storefront filtering allows customers to easily narrow down products on collection pages.
• It improves the user experience, organization, and aesthetics of collection pages.
• Enabling storefront filtering can lead to increased conversions and sales.
• Custom filters can be created using meta fields to match specific product attributes.
• Refreshing the collection page shows only the products that match the selected filters.

FAQ:

Q: Can I enable storefront filtering in any Shopify theme? A: Storefront filtering is available in online store 2.0 compatible themes, which include all of our themes.

Q: How can I customize the display options for filters? A: Depending on the theme, you can choose to display filters in a sidebar, a drawer, or turn them off completely.

Q: What happens if I add a custom filter, but none of my products match the filtering criteria? A: The filter option will not be shown on the collection page until there are products that match the filtering criteria.

Q: Can I add multiple custom filters to my collection pages? A: Yes, you can create multiple custom filters using meta fields and assign them to different products based on their attributes.

Q: Do I need to manually update the filters when I add new products or change product attributes? A: No, the filters are automatically updated based on the product details and attributes you have assigned in the admin panel.