Shella Shopify Theme
  • User Manual
  • Shopify help
  • Get Started
    • How to create a new Template
    • How to add and edit a Page
    • How to build Metaobjects
    • How to find a handle
    • Filters logic
    • Pre-Order
  • Product variants
  • Header
    • Theme Blocks
  • Footer
    • Theme Blocks
  • Metafields
    • How to create custom filters
  • Theme Sections
    • Builder
      • Promo box (Banner)
      • Slick Slider
      • Revolution Slider
      • Instagram
      • Product column
      • Custom HTML
      • Space for vertical menu
    • Spacer
    • Article carousel
    • Brand carousel
    • Product carousel
    • Review carousel
    • Contact form
    • FAQs
    • Gallery
    • Information line
    • Search form
    • Subscription form
    • Brands
    • Collections
    • Lookbook
    • One product
    • Collection page heading
      • Theme Blocks
    • Collection banner builder
      • Theme Blocks
    • Ticker
  • Products
    • Product page
      • Theme blocks
    • Related product carousel
    • Usage information sidebar
  • Collections
    • Product grid
      • Current filters
      • Collections
      • Filters
      • Filter settings
      • Tags
      • Products
      • Custom HTML
      • Subscription
      • Promo box (Banner)
  • Collections list
  • Page categories
    • Policy page
    • Lookbook
      • Page
    • Gallery
      • Page
    • FAQs
      • Page
    • Contact
      • Page
    • Brands
      • Page
    • Password
      • Social media
    • Search
      • Current filters
      • Filters
      • Filter settings
      • Products
      • Custom HTML
      • Subscription
      • Promo box (Banner)
    • Quick view
  • Blogs
    • Theme Blocks
  • Blog posts
    • Theme Blocks
  • Theme settings
    • Quick Start
    • License
    • Logo and Favicon
    • Layout
    • Colors
    • Typography
    • Collection and Search page
    • Product -> General
    • Product -> Variants
    • Product -> Collection Page
    • Product Page and Quick View
    • Search
    • Currency
    • Cart
    • Wishlist and Compare
    • Payments
    • Social Media
    • News Subscription
    • Blog and Article Pages
    • Account
    • Reviews
    • Services
    • Apps and Language
    • Button, Input and Promo Box
    • Notifications
    • Pre-loader
    • Animations
    • Developer
    • Custom CSS
  • Theme features
  • Back to Help Center
Powered by GitBook
On this page

Was this helpful?

  1. Metafields

How to create custom filters

In this article, you can find an example of creating a Metafield definition for a custom filter and how to connect it with the theme.

PreviousMetafieldsNextTheme Sections

Last updated 27 days ago

Was this helpful?

You can create custom filters via Metafields to display various information, color swatches, numbers, etc. in the Sidebar. Make sure that you are familiar with the criteria for creating Metafield definitions for filtering. The detailed information, you can find in Shopify .

In order to create a custom filter please follow these steps:

Step 1

Go to your Shopify Admin -> Settings -> Custom data -> Metafields -> Products:

Step 2

Create a Metafield with a metafield format:

  • Name = e.g. Gender

  • Namespace and key = e.g. my_fields.gender

You can use the "Namespace and key" which is automatically pulled by the system, or you can use a unique namespace (e.g. “my_fields.” ) to build a route to your definition and not overlap with a keyword (e.g. “gender”). So, a special route for the Metafield might display product.metafields.my_fields.gender

  • Description = optional (will be shown on pages only in your Shopify backend to help you fill out the metafield correctly)

  • Select content type: Text -> One value/List of values

You can display filters using the following value types: Single line text, Single line text (List), Decimal, Integer, and True or False.

Step 3

Navigate to Products in your Shopify Admin and add a value for a Metafield:

Step 4

To display a new filter on the storefront, add it to the list of filters in Shopify Admin -> Apps -> Shopify Search & Discovery app:

  • Select the Search & Discovery app from the list of apps.

  • Then, choose the “Filters” item in the side panel of the Admin and press the “Add filter” button:

  • Now you can choose the required filters from the list of the “Source” drop-down:

Save the changes.

Step 5

Go to Shopify Admin -> Online Store -> Themes, choose the theme, and press “Customize”.

Find more information on how to add a Mertafield definition .

In the Theme Editor -> Theme settings -> , configure options of the “Sidebar visibility” and “Sidebar position on desktop”:

here
Collection page
documentation