How do I change filter titles in the new OS 2.0 filter pane (from "Brand" to something else)?

nadimnahas
Excursionist
42 0 12

Hi all, 

Is there a way to change the titles in the new Shopify filter pane in OS 2.0?

I want to change "Brand" to "Artist" and "Product Type" to "Theme".

Also I do not understand why shopify does not allow us to filter by tag.... it has to be one of the most important filtering functionalities for stores and it's crazy that they took it out even when it existed in OS 1.0 under Filter Groups!!

nadimnahas_0-1635303072445.png

 

Replies 15 (15)

Evgeniy-M
Shopify Partner
44 6 10

Hey @nadimnahas .

Shopify supports filtering by metafields out of the box.

So you can attach metafields to products and add filters in the same way how you added the "Product type" and "Brand" filters:

EvgeniyM_0-1635323536102.png

The "Test", "Value 1" and "Value 2" come from the product metafields.

To set up metafields you should go to "Settings -> Metafields -> Products" in the Shopify admin panel.

I used the "Single line text" type metafiled for the above example.

Liquid Ajax Cart — a Javascript library to build Shopify Ajax Carts using plain Liquid templates.
medlingtonQPS
Shopify Partner
27 0 8

Hi Evgeniy-M,

Thats an interesting solution, Im surprised Shopify support havent suggested that to us as a possabliity but then their only solution for everything seems to be buy a paid app.

This would still be a much clunckier solution than the filter by tags as it means setting up a metafield for each possible tag which is quite labourious. 

Im just testing this out and have added the metafield within settings and then applied it to a product however I cannot get it to show as an option within theme > navigation > filters

I set a true or false metafield.

Also is there anyway to alter these metafields on mass as they dont seem to appear on the bulk editor when I try that which again makes this a very time consuming solution.

Evgeniy-M
Shopify Partner
44 6 10

Hey @medlingtonQPS . Actually I tested with the "Text" metafield type only. 

It is good for filters that can have a lot of different values.

For example you can create "Artist" metafield for products. Then within each product you will specify different artists and then all of them will appear in the filter form. So you don't need to add a lot of different metafields for each artist.

I guess the Shopify support didn't tell you about it because it is a new feature. I didn't see it before. Maybe it has been here for a one week only.

Let me try with the "true false" metafield also.

 

Liquid Ajax Cart — a Javascript library to build Shopify Ajax Carts using plain Liquid templates.
medlingtonQPS
Shopify Partner
27 0 8

Thanks,

Our main issue is our products can have several tags from the same category at the same time.

So we sell football goals and have a filter for 'ages' for which age groups the goals are suitable.

Many of our goals are suitable for 'kids','teens' and adults so they should appear if any of those filters are pressed. My idea to get around this was to have a metafield for each age range with a true or false input. We had many different filters setup for our products that were similar in that a product could have several of the tags from the same category of tag. Another example is that these goals are used on different surfaces and many are suitable for several different surfaces.

 

LitExtension
Shopify Partner
4860 1001 1132

Hi @nadimnahas ,

Please go to snippets/facets.liquid file, change code in line 48 and line 301.
https://i.imgur.com/UcbKkhA.png => https://i.imgur.com/2uTwg8w.png 
https://i.imgur.com/GtPsbKc.png => https://i.imgur.com/g7VxWb1.png 

Code:

{%- if filter.label == 'Brand' -%}
  <span>Artist</span>
{%- elsif filter.label == 'Product type' -%}
  <span>Theme</span>
{%- else -%}
<span>{{ filter.label | escape }}</span>
{%- endif -%}

Hope it clear to you.

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
nadimnahas
Excursionist
42 0 12

Hey there, the solution is very clear but I don't seem to have a facets.liquid file under snippets 🙂 

What's the solution to that?

LitExtension
Shopify Partner
4860 1001 1132

Hi @nadimnahas ,

You don't have to use the Dawn theme? If so, you need to follow the steps:
- Step 1: Go to sections/main-collection-product-grid.liquid file.
If you don't have this file, you need to search 'main-collection' and click on the files displayed in Sections. Ex: https://i.imgur.com/41AYNXQ.png 
- Step 2: Find 'collection.filters' and change code:
<span>{{ filter.label | escape }}</span>
=>
{%- if filter.label == 'Brand' -%}
<span>Artist</span>
{%- elsif filter.label == 'Product type' -%}
<span>Theme</span>
{%- else -%}
<span>{{ filter.label | escape }}</span>
{%- endif -%}
https://i.imgur.com/z2hdFmM.png 
Hope it helps!

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
nadimnahas
Excursionist
42 0 12

Hey there, 

I tried that but below are the results:

Screenshot 1.jpg

Screenshot 2.jpg

It only added "Artist" and "Theme" next to the original labels. Any fix?

Evgeniy-M
Shopify Partner
44 6 10

You should put your new {% if %} ... {% endif %} INSTEAD of the underlined {{ filter.label | escape }} like this :

<div class="filter-group__heading__text">{% if ... %} ... {% endif %}</div>
Liquid Ajax Cart — a Javascript library to build Shopify Ajax Carts using plain Liquid templates.
LitExtension
Shopify Partner
4860 1001 1132

Hi @nadimnahas ,

Please change:

{{ filter.label | escape }}

=>

{%- if filter.label == 'Brand' -%}
Artist
{%- elsif filter.label == 'Product type' -%}
Theme
{%- else -%}
{{ filter.label | escape }}
{%- endif -%}

Refer: https://i.imgur.com/5exSfRo.png

Hope it clear to you.

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify

LitExtension
Shopify Partner
4860 1001 1132

Hi @nadimnahas ,

Did you follow my instructions?

Because i checked and it should help you to solve the problem.

Thank you.

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
coyotecody614
Visitor
1 0 0

Any idea how to do this in the Symmetry theme?

LitExtension
Shopify Partner
4860 1001 1132

Hi @coyotecody614,

You can create a question on the community and send me the link. I will check it.
Because this will help build a better community.
Thank you.

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
TheQuadraphonic
Visitor
2 0 0

I've tried adding some of the code you've posted previously, but I can't find the code you say needs to be replaced. Is this information out of date? 

dechimp
Shopify Partner
6 0 7

I had this problem when trying to change the name of a filter that points to a custom metafield. 

 

But I figured it out.

 

The thing I didnt realize is that when you go into the metafield and change the name, it wont be reflected on your filters right away.  You have to go into Online Store > Navigation > Collection and search filters > and then delete the filter and add it back in. Then the name will show up correctly.