The journal · · 5 min read
Shopify Metafields: Better Product Pages Without Apps
By Jean Perry — Editor, Kiosk
Metafields are the difference between a product page you assemble by hand every time and one that fills itself in. They let you add your own structured fields – materials, dimensions, care instructions, a size chart, an ingredient list – to every product, and have your theme display them in exactly the same place, in exactly the same style, on all of them. No apps, no code, no copy-pasted HTML in a description box.
What a metafield actually is
A metafield is a named piece of extra data attached to a Shopify object – a product, a collection, a page, a customer. It has a namespace, a key, and a type. Together the namespace and key form the handle you use in the theme: custom.composition, custom.size_guide, custom.care.
The type is the part people underestimate. A single line text field behaves differently from multi-line text, and both behave differently from integer, file, list of products or rich text. Choosing the right type is what stops you from storing “200” as text and then being unable to sort by it, or storing an image as a URL string that breaks the day you rename the file.
Creating one, step by step
In your Shopify admin, go to Settings → Custom data → Products, then Add definition.
Give it a clear name (“Composition”), and check the handle Shopify proposes underneath – that is what your theme will reference, so keep it lowercase and predictable, like custom.composition. Choose the type: multi-line text for a paragraph, single line text for a short label, integer for a number you might sort or compare, file for a PDF or an image, and rich text only when you genuinely need formatting inside the value.
The step that catches everybody: under the definition’s access settings, make sure storefront access is enabled. A metafield without storefront access exists in the admin but is invisible to your theme, and you will spend twenty minutes convinced your Liquid is broken when the data simply is not being exposed.
Once the definition exists, the field appears at the bottom of every product page in the admin, in a Metafields block. Fill it in per product.
Displaying them without touching code
You do not always need a developer. In the theme editor, many blocks – text, rich text, and dedicated metafield blocks in newer themes – support dynamic sources: click the small database icon beside a field and pick your metafield. The block then shows that product’s value on every product, automatically.
This is the right approach for simple cases: a materials line, a care note, a country of origin. Its limit is layout. Dynamic sources render the value as text where you placed the block; they cannot turn a CSV of measurements into a table, or a list of products into a styled row of cards.
Reading them in Liquid
For anything structured, the theme reads the metafield directly. The pattern is always the same, and always guarded so that products without the field do not render an empty heading:
{% if product.metafields.custom.composition != blank %} … {{ product.metafields.custom.composition }} … {% endif %}
Three details worth knowing. For typed metafields you often want .value to get the underlying data rather than the object – particularly for files, lists and references. For multi-line text, pipe it through newline_to_br so line breaks survive into HTML. And for a list type – say a list of related products – you loop over .value like any array.
A well-built theme does this for you and simply documents which handles it expects, so all you do is create the definitions with matching names and fill them in.
Three patterns that earn their keep
The size guide as data. Store a small CSV in a multi-line text field – first line the headers, then one line per size – and let the theme render it as a table. Every product gets a correct chart, and updating one product does not risk breaking the layout of another. Pair it with a second field for the size worn by the model and the theme can highlight that row.
Care and composition blocks. Two fields, rendered as collapsible sections under the buy button. They keep the description short and readable while making the detail available to anyone who wants it – and they force consistency across your catalogue, which is what makes fifty products feel like one brand.
Editions and provenance. An integer field for the edition size, another for a position number, a text field for the season or batch. Numbers you can display as badges, sort by, and use in collection filters. This is how a catalogue starts feeling like an archive rather than a list.
Common mistakes
Using the custom namespace for everything is fine and normal – but keep your keys descriptive, because you will not remember what custom.field_2 meant. Do not store HTML in a plain text field and expect it to render; either use rich text or let the theme do the formatting. Do not create a metafield for something Shopify already has natively – SKU, weight, barcode, vendor and product type all exist already, and duplicating them creates two sources of truth. And before you build anything on a metafield, confirm the storefront access setting, because that single checkbox explains most of the “my metafield is not showing” questions ever asked.
Where to start
Pick the one piece of information you currently retype into every product description. Create a definition for it, fill it on five products, and display it – via a dynamic source if your theme allows, or by asking whoever maintains your theme to add four lines of Liquid. Then do the next one. Within an afternoon your product pages stop being documents you write and start being records you fill in, which is both faster and far more consistent.
FAQ
Why is my Shopify metafield not showing on the storefront?
Nine times out of ten, storefront access is not enabled on the definition. Go to Settings, Custom data, pick the definition and make sure it is exposed to the storefront. Without that, the field exists in the admin but your theme cannot read it, no matter how correct your Liquid is.
Do I need a developer to use metafields?
Not always. In the theme editor, many text and rich-text blocks support dynamic sources, so you can point a block at a metafield and it will show each product's value automatically. You only need Liquid when the value needs structure the editor cannot produce, such as turning a CSV into a size table or looping over a list of products.
What is the difference between a metafield and a variant?
A variant is something a customer chooses and buys, with its own price, SKU and stock, such as a size or a colour. A metafield is information about the product that is not for sale, such as composition, care instructions or country of origin. If your customer picks it at checkout it should be a variant; if they only read it, it should be a metafield.