Homepage → Shoptimized Theme → Collection Pages → Collection Filters

Collection Filters

Collection filters work via tags that are applied to the products you would like to filter...
Written by Jonathan Diaz
Updated 2 months ago

Collection Filters

1 The first step is to open the theme settings area of your Shopify theme config and go into the Collections section.

Step 1 image

2 Now scroll down and click Enable sidebar filters.

Step 2 image

3 Now, go back to the theme settings area and open Collection Filter #1 section.

Step 3 image

4 Next, click Enable.

Step 4 image

5 Enter Filter Heading.

Ex.  If you want color filter then the heading should be 'Color'.

Step 5 image

6 Next, enter tags.

A tag must be a comma(,) separated.

Ex. 'Navy, Red, Green, Blue'

Step 6 image

7 Now, click save to save settings.

Step 7 image

8 Now, go back to the theme settings area and open Collection Filter #2 section.

Step 8 image

9 Next, click Enable.

Step 9 image

10 Enter Filter Heading.

Ex. 'Size'.

Step 10 image

11 Next, enter tags.
A tag must be a comma(,) separated.

Ex. 'S, M, L, XXL'

Step 11 image

12 Now, click save to save settings.

Step 12 image

13 Now, go back to the theme settings area and open Collection Filter #3 section.

Step 13 image

14 Next, click Enable.

Step 14 image

15 Enter a Filter heading.

Ex. 'Brand'.

Step 15 image

16 Next, enter tags.
A tag must be a comma(,) separated.

Ex. 'Adidas, Shoptimized'

Step 16 image

17 Now, click save to save settings.

Step 17 image

18 Now go to the admin area and click Products.

Step 18 image

19 Open a product that you want to include in the filter.

Step 19 image

20 Now, scroll down and go to the Tags section.

Add all the tags one by one.

Step 20 image

21 Color Filter Tags: Navy, Red
Size Filter Tags: S,M,XL

Step 21 image

22 Now, click save to save your theme config and preview your changes.

Repeat step 19 to 22 for all the products that you want to include in the filter.

Step 22 image

23 Collection page filter.

Step 23 image

Here's an interactive tutorial for the visual learners

https://www.iorad.com/player/1584603/DemoStore---Collection-Filters

Collection filters work via tags that are applied to the products you would like to filter. 


Currently the collection filters work with 3 different criteria at any given time, for example, you could filter with 'brand', 'size' and 'color'.


An example would be if you would like to add size and color filters to a range of T-Shirts, first, you would want to configure collection filter 1 & collection filter 2 inside of the theme config. 

 

Important - for this feature to work you'll need to create a collection called 'All' and include all products with a price greater than $0

  1. Name the filter heading for collection filter 1 'Color'.
  2. Underneath in the tags section, you'll add the colors you would like to be included in the filter menu, for example red, blue, purple.
  3. Follow this same procedure for size, for collection filter 2 you would have the filter heading as 'size'
  4. Then underneath in the tags section, you'll include the sizes, for example, s, m, l, xl (be sure to include the space after the comma) 
  5. In the back end of Shopify apply the red tag to all of the red t-shirts, the blue tag to all of the blue t-shirts and so on...
  6. You have guessed it, do the same for size, apply the tag small for all small shirts, large for all large shirts and so on.
  7. That's it, your filters should be working exactly as you would imagine them to. 

 

Collection filters help your customers get granular with their searching. You can specify color, size, brand, material, or any filtering method applicable to your store.

Did this answer your question?
close-image
full-image