ShopBase Help Center

Explore How-To's and learn eCommerce best practices from our knowledge base.

Home
Theme
Display filters on your store

Display filters on your store

This article is also available in:
Chinese Vietnamese

With ShopBase, you can customize your collection and search filter so that your customers can quickly find products by their availability, price, color, and more on the collection page. In this article, we will show you how to display filters on your store.

In this article

A. Display filters on your store

B. Change the layout of a filter

C. Enable color swatches in your filters

A. Display filters on your store

After creating your filters, you can display them on your online store by following the steps below:

From your ShopBase admin, go to Online store > Themes. Click Customize next to the Inside or Roller theme you want to edit.
Click on the drop-down menu and select Collection to customize your collection pages.
Click on Collection section.
Check the box next to Enable filtering to enable filters on your store's collection pages.
In Filter title, you can customize the title of the sidebar filter displayed on the storefront. The default title is Filters.
Once finished, click Save.

This filter is only available for Inside and Roller themes.

Filters are only displayed in collections with less than 1,000 products.

Filters will not appear if collections are sorted by Featured (or Manual).

B. Change the layout of a filter

Filters will be displayed in the collection and search result pages. You can select among 3 different filter layouts to display on your store by following the steps below:

From your ShopBase admin, go to Online store > Themes. Click Customize next to the Inside or Roller theme you want to edit.
Click on the drop-down menu and select Collection to customize your collection pages.
Click on Collection section.
In Filter position, select:
Left sidebar: The filter options will be displayed on the left sidebar.
In drawer: When the customer click on the Filters button, the filter options will be displayed.
On top: The filter options will be displayed horizontally above the product list.
Once finished, click Save.

C. Enable color swatches in your filters

When your filter contains product color options, you can display color swatches instead of color names and help your customers easily visualize the product.

Color swatches in collection filter
From your ShopBase admin, go to Online store > Themes. Click Customize next to the Inside or Roller theme you want to edit.
Click on the drop-down menu and select Collection to customize your collection pages.
Click on Collection section.
Select Enable color swatches in Color filters.

This feature will only works if the option name of the products in the filter is Color, Colors, Colour, or Colours.

Make sure that the values of all color variants in your filter are supported. You can refer to the list of supported color values here. If a product color variant is not a supported value, no color swatches will be displayed in the filter.

In this example, "Auburn" is not a supported color value, therefore, the filter options will be displayed as list of names instead of color swatches
Overview of Products
Customize collection and search filter
Overview of Collection