Product Filtering by Boost Commerce vs Shopify OS 2.0 Storefront Filtering

Jun 7, 2024

•

3 min read

Latest update in April 2023: Boost goes AI!

Boost Product Filter & Search now becomes Boost AI Search & Discovery. We are employing AI/ML technologies to the core of our products to bring more conversion-boosting features to Shopify merchants. The latest release includes AI-powered search, AI-powered recommendation, revamped Visual merchandising, and more.

Shopify Unite 2021 has brought a myriad of breakthroughs to both online merchants and Shopify app builders, especially with the Shopify Online Store 2.0 (OS 2.0). The new theme structure and architecture has introduced Shopify merchants with new functions, which previously required a third-party app to perform.

In August 2022, Shopify introduced Shopify Search & Discovery app to replace the used-to-be-known-as Storefront filtering on OS 2.0. This article will compare product filters backed by Product Filter & Search - #1 app for collection filters on Shopify App Store and the default Shopify App.

Note: Product Filter & Search by Boost Commerce can currently be set up on most Shopify vintage themes and popular OS 2.0 themes like Dawn and Warehouse (view details). We also offer Theme App Extension for Shopify OS 2.0 stores using a theme with Section everywhere. Please drop us a line via support@boostcommerce.net to see how it works.

OS 2.0 themes have a label on the right-hand corner to indicate the compatibility with the new store structure. (Source: Shopify Themes Store)

‍

Comparison table

Try Free Now

Product filter options

The diversity of filter options

With the updates of OS 2.0, Shopify allows merchants to create storefront filtering, including Filter by

Availability - Default
Price - Default
Product type - Default
Vendor (Brand) - Default
Product options - Custom
Metafields (March 2022 update) - Custom

for collections in the Navigation setting. Currently, Shopify allows merchants to add up to 4 default filters and up to 20 custom filters.

Compared with the 5 essential filter types according to Baymard, it only misses the Filter by Rating. Besides, it no longer supports Tag Filtering - a very helpful and popular filter option in many stores. As a result, the product filtering of Shopify is quite sufficient for small online stores with an inconsiderable number of items.

Merchants can now add filters on collection pages in the Navigation setting of the Shopify dashboard.

An important thing is that if your customer has their currency set to anything other than your store's primary currency, then the price filter of OS 2.0 isn't displayed. Furthermore, the native filters are hidden for collections with over 5,000 products. (Shopify Help Center)

Apparently, there are some limitations in the current product filtering of Shopify. That's why online merchants need our app to fill in the gaps. With us, you can create an extensive range of filters. Thanks to the powerful Filter by Tag and Metafield, it's actually a piece of cake to make a filter out of anything.

Besides pre-made filter options for Collection, Title, Percent Sale, and Review Ratings, you can create unlimited filters from any product attributes with the Filter by Tag and Filter by Metafield using our app.

Arranging and renaming

With both options for product filters, you can drag and drop to rearrange the order of filter options in your storefront.

However, relabelling the filters using the Navigation setting of OS 2.0 is not possible now. On the other hand, these changes can be done effortlessly in our app.

The general settings of filter options in the Boost app let users edit the label, display, Select type, and even choose to include or exclude certain values.

Displaying filter option values

Most of the storefront filtering on OS 2.0 themes will show up as a list with multi-selection. The Filter by Price is usually displayed as a range slider while Filter by Color tends to be a swatch in most of the OS 2.0 themes. These are the most recommended display types for these two filters, so it's quite convenient and time-saving when creating filters with the Shopify Navigation setting.

By default, most OS 2.0 themes show Price filter as a range slider, Color filter in a swatch, and the rest using a list.

However, if you have product options like length, height, width, you will want to display them in a range slider rather than a list because there will be too many values. Unfortunately, you can't change how the filters are displayed on your storefront on OS 2.0 themes unless you dig in the code editor.

Our Custom range slider tool allows merchants to turn any numeric product attributes into a range slider. Likewise, the Swatch settings feature in our app is much smarter. Boost users can add their custom images in the swatch display to help shoppers visualize the color or shape of the products.

(Source: Red Dress, Cook Woods

Not only displaying values in a list, swatch, or range slider, Boost helps you show filter values in “box”. You can decide the select type (multiple vs single) and choose to include or exclude certain values. Advanced settings even support you to display a tooltip to explain industry jargon, choose a sort type for the filter values, and more.

The advanced settings of filter options using the Boost app.

What’s more, Boost users can optimize filters that have a long list of values by adding a scrollbar, a View more button, or enabling a search box in the filters.

When there are too many values for a filter, it's better off to use a truncated list with a search box for a neat and clean UI. Boost app also allows sorting filter values according to product number so you can prioritize the most popular ones in the truncated list. (Source: Thahab)

Multi-level filters contribute to proper hierarchy arrangement - the foundation of a good user experience. That can be done with our app for Filter by Collection and by Tag.

This is how a multi-level Collection filter works on Boost's demo store. The native features of OS 2.0 themes won't let you customize this.

Filter trees for different collections

A drawback of the Shopify storefront filtering is the fixed filter options. After you enable it, all collections will share the same filter tree.

Different collections using product filtering of Shopify OS 2.0 have almost the same filter options except for the Filter by Product options. You can't make the Availability filter visible on the Fashion collection page only.

The great thing about our app is users can tailor a specific filter tree and assign it to a particular collection. Look at the example below.

Pro Photo Supply applies different filter options in Lens Filters collection (left) and in Backgrounds collection (right). (Source: Pro Photo Suppl

Product filter layout

2 positions where online stores usually place the collection filters are in the horizontal toolbar and in the left sidebar.

The former brings a better layout for the filter tree with around 3-4 options that stay pretty much the same all the time. Meanwhile, the latter is excellent at accommodating more than 8 filters, which possibly grow over time.

OS 2.0 themes usually design the filters to match the overall look of the storefront. That's why they usually have 1 option for the filter layout. You don't need to spend too much time thinking about which position is better for UI/UX.

Different OS 2.0 themes place filters in different positions.

A handful of OS 2.0 themes do allow merchants to change the position of the filters. However, there can be some flaws while switching the filter layout in theme editing.

There are some issues when changing the filter mode.

Boost Product Filter & Search allows users to switch from horizontal layout to vertical layout and vice versa within a few mouse clicks.

Our support team can also assist you in building an off-canvas layout and other customization for filter layout upon request.

Advanced settings for filters

Display settings for filter trees

Currently, the basic filter setting in OS 2.0 themes only lets users add or remove filters. The appearance of the filters will completely depend on the theme you are using.

Most OS 2.0 themes offer limited settings to customize filters or sort types.

The basic settings in such OS 2.0 themes are insufficient. The filter display settings in the Product Filter & Search app offer a lot more options to let you control appearances on both desktop and mobile versions.

Pagination styles

OS 2.0 themes tend to arrange the product list in classic pagination, which is the most popular way to load new items on a website.

However, the test finding from Smashing Magazine reveals that with pagination “test subjects were observed to browse much less of the total product list than on websites that rely on “Load more” buttons or infinite scrolling”.

In the Product Filter & Search app, you have many more diverse options with traditional pagination, infinite loading, and the Load more button.

Some OS 2.0 themes offer 2 pagination styles while with the Boost app, you always have 3 options.

Sorting options for Collections and Search results

By default, there are 5 sorting options enabled on the Shopify Collection pages of OS 2.0, including 3 out of the 4 most necessary according to Baymard: Sorting by Price, Best-Selling, and Newest (Date, new to old).

5 default sorting options available on almost all OS 2.0 themes can cover most of the basic sort types that are commonly sought out by online shoppers.

The downside is, you are not able to change the order, add or delete the sorting options. Moreover, these Sort by options won't appear on Search result pages.

Sorting can facilitate the buying process, so we have built a separate feature for users to create and update sorting options for both Collection pages and Search result pages. Moreover, you can add Sort by Relevance, Percent sale, Ratings, Tag, Metafields, and more. These are not supported by Shopify OS 2.0 themes.

Filters on Search result pages

Filters on search result pages are not a “nice-to-have" feature. It's a must-do action if you want to get hold of at least 14% of sales from site searchers.

As for now, Shopify storefront filtering on the search page is available on some newly released themes such as Taste, Crave.

However, we tested with Dawn theme - the very first theme that supports OS 2.0, and the search results don't come with filters and Sort by options.

The Search filter tree is one of two standard filters in the Product Filter & Search app by Boost Commerce. It is enabled by default after you install the app, but you can easily turn it off using a toggle.

Which solution for product filtering should you choose?

Pros and Cons of OS 2.0 Storefront Filtering

Shopify has made awesome updates with OS 2.0 and they’ll keep adding more offerings as well as opening new prospects for online merchants. The release in Unite 2021 allows small-sized businesses to set up the storefront filtering in the Navigation setting.

To a certain extent, the default filters and sort types can cover some basic needs of online shoppers when it comes to narrowing or rearranging the product list. Therefore, if you are starting small with a tight budget, you may consider utilizing this free option from Shopify.

Still, OS 2.0 storefront filtering has little room for customization and optimization especially when your Shopify stores are scaling up.

Pros and Cons of Product Filtering by Boost Commerce

Using a third-party app poses a risk of conflicting with the theme code. Hence, our engineering team has been working with many theme providers to ensure a smooth integration with full compatibility. You can see the list of supported themes here. Moreover, we can help you integrate with any other themes upon request.

Getting to know how to use a new app may take some time. Yet, the learning curve is shallow with the Product Filter & Search app with a clear onboarding flow, step-by-step guidelines, and demo videos. You can also use live chat, email, and our Help Center to understand the app’s functionalities. Besides, we follow Shopify Polaris in the app's UI/UX so you have a consistent experience when switching between Shopify settings and Boost app settings.

Using a third-party app for product filtering, you will need to pay an extra cost. However, our app offers far more complete solutions that totally worth the price. The Boost app offers a wide range of additional features for users to make the filters user-friendly, well fit their strategies, and identical to their branding.

Merge values

This feature helps you group similar Tags, Product options (like Color, Size, etc.), Vendor, and Product type values that usually have a low product count. For example, you have Light Blue, Dark Blue, Ice Blue for Color variants. Each of them only has 2 or 3 items. To enhance buyer experience, you can merge these variants into one value for Blue. While the native filters of OS 2.0 themes won’t let you do that, Merge values in our app can.

Product visibility

Free items and out-of-fashion products shouldn't pop in the Collection pages and the Search result pages as they are of little use in boosting sales. Hiding them in Collections and Search results can draw the customers' attention to more profitable products.

The Product visibility feature, which utilizes tags, helps you do. Product items can be hidden from Collection pages, Search result pages, and even the Instant search widget.

Read more on Product visibility.

‍

SEO-friendly URLs (March 2022 Update)

When customers select multiple filters, the URL becomes lengthy and unpleasing to search engines. This https://yourshopify/collections/dresses?pf_opt_size=S&pf_opt_size=XS is the standard URL for filter pages.

Our app helps you shorten the URL by removing the prefix " pf_xxx_” and combining the keys into one (values separated with a comma). So the URL above after shortened looks like this https://yourshopify/collections/dresses?size=S,XS.

Check out Why filter pages are holding your SEO and How to fix

Additionally, you can enable using canonical URLs so that the product detailed page's URL will turn from https://yourshopify/collections/t-shirts/products/blue-tee to https://www.myshopify.com/products/blue-tee.

Variant display (March 2022 Update)

Variants display feature lets you separate variants of a product and display them as individual products on collection pages, search results page, and instant search results.

Moreover, we released Show matched variant image by filter option. Here is how it works on your storefront.

Smart site search

Our app comes with a full package for product discovery from site search to filter. When using the app, you can enable the Instant search widget, which offers an extensive range of functionalities such as Auto-suggestion, Typo tolerance, Redirects, Synonyms, Stop words, etc

Check out our Demo store to see how the smart site search of Boost Commerce works.

Some OS 2.0 themes do have the Instant search widget, but it only suggests products, articles, and pages unlike our app which also involves keywords and collections. Users can tailor this widget (rearranging the suggestions, picking the highest number of displayed results, adding autosuggestion in case of no products found, etc).

The Instant search widget in some Shopify OS 2.0 themes is much simpler than that of the Product Filter & Search app.

Merchandising on the Search result page

With the help of Merchandising features, you have more control over the product orders on the Search result pages. You can prioritize a specific item using Product ranking or promote a group of products with Rule-based merchandising.

We add a promotion rule to show all products from vendor DIOR first using Rule-based Merchandising and this is the result.

Analytics about Filter and Search engagement

Insights about customer behaviors are invaluable for the decision-making process. That's why we have developed and kept updating our Analytics feature.

In the Collection Analytics report, you can know:

Total filter clicks: showing the interest of customers for a group of products.
Top filter option value: indicating how exactly your customers narrow down the product list.
Top filter option value combination: implying which combinations of product attributes are most looked for.

Meanwhile, the Search Analytics report reveals:

Top search terms: showing what your customers search for.
Top search terms with no result: helping you recognize what your customers might need but you are not selling.
Total searches: reflecting how many times your shoppers use the store search box.
Total filter clicks on the search page: showing the number of clicks on our filter trees of the search result.
Top filter option value on the search page: showing details of how exactly your customers narrow down the search results.

Both reports also have Total sales generated by app to show how much you earn from customers' engagement with filtering and site search. To make it accurate, we have the Ignore IPs setting for you to exclude testing and internal teams' IPs from the report.

In conclusion

We hope that with this comparison, you can decide whether to use our app to fuel your online store. In case you are still hesitating, we have a 14-day free trial period for you to access and try all available features. Click the button down below to become a trial user, we’re sure you'll love it.

Try Free Now

‍

Trusted by fast-growing brands

Start your 14-day free trial

Get started

Ellie Ho

•

Content Marketing Specialist

July 1, 2024

•

6 min read

Product Filtering by Boost Commerce vs Shopify OS 2.0 Storefront Filtering

Start your 14-day free trial

Related Posts

From AppHub to Clearer.io: Making Product Discovery Smarter

Boost AI Search & Discovery: Q3 2024 Feature Updates

Boost AI Search & Discovery: Q2 Updates