Sidebar filters with images

This setup allows you to display filter options in the Collection page sidebar as images instead of plain text. This is useful for brand logos, color badges, or any visual filter style.

Create and Assign Brand Filter Data (Metaobject + Product Metafield + Entries)

Go to Content → Metaobjects → Add definition

Configure the metaobject here as follows:

1. Name: filter-brands

The Type will be generated automatically as: filter_brands

In Fields, add:

1. Heading → Single line text

2. Image → File (image)

3. Metafield options → Enable “Publish entries as web pages”

4. Save the definition.

1. Go in Shopify admin: Settings

1. Open the item from the left menu: Metafields and metaobjects

2. Choose the Products

1. Click Add definition

1. Fill the field Name: filter brand

2. Change Type → select List of values (so it becomes a repeatable list)

1. Click Select type → choose Metaobject

1. Select the previously created filter-brands metaobject. Press the Save button

1. Open any product in the admin, scroll to Product metafields, find filter brand, and click Add new entry

In the popup:

• Enter the brand name

• Upload/select the image logo

Save the entry.

Repeat for all products and all needed brands.

---

Add the Filter to Storefront Filtering using the Search & Discovery app.

• Go to Apps → Search & Discovery → Filters, Click Add filter

• In the field Source, choose filter brand

• Then click Manage values

• In the value display settings, select the radio button Image