How to show your specifications on cards and product pages

Last checked against Splash 1.0.0 / 2026-08-15

Every specification Splash prints comes from a product metafield you create and fill in yourself. The theme never guesses a figure and never invents one. Create the metafields once, then decide where each one appears.

There are five places a specification can show, and they are configured separately. Four of them are below. The fifth is the optional Product details section, which carries a second table of its own and is covered at the end of this page. Nothing appears in any of them until the metafields exist and a product carries a value.

Step one: create the metafield definitions#

This is the step everything else depends on, and it happens in Shopify admin rather than in the theme editor.

Go to Settings, then Custom data, then Products, then Add definition. Give the definition a name, set its type, and save. Repeat for each figure you want to publish.

The namespace and key#

Shopify writes the metafield's address as a namespace and a key joined by a dot. That address is what you type into the theme, and it must match exactly.

specs.flow_rate     correct
custom.flow_rate    correct, if that is the address you created
flow_rate           wrong: no namespace
specs/flow_rate     wrong: slash instead of dot
specs.pump.flow     wrong: more than one dot

Exactly one dot. The theme reads everything before the dot as the namespace and everything after it as the key, so a second dot leaves it looking for a key that does not exist. There is no error message when this happens: the row is left out of the page.

When you create a definition, Shopify proposes an address for you, usually custom. followed by the name you typed. You can edit it on the spot. Splash ships pointing at specs.flow_rate, specs.head and specs.power, which are the demo store's pump measurements and will not exist on your store. Either create your definitions in a specs namespace with those keys, or leave them in custom and change the theme settings to match. Any namespace works as long as the two sides agree.

Requires The definition must be readable by the storefront. Look for the Access section on the definition and confirm Storefronts can read it. A definition that only the admin can read is filled in on the product page and invisible on the storefront.

Step two: fill in a value on each product#

Open a product in admin and scroll to the Metafields section at the bottom of the page. Fill in the definitions that apply to that product and leave the rest blank.

Leaving one blank is a supported state, not an omission. Rows are resolved per product, so one configuration can cover a catalog where a pump carries a flow rate, a heater carries two of the three, and a sun lounger carries none. Each product drops the rows it cannot answer. This is deliberate across the whole theme: see why Splash shows nothing rather than a guess.

Specifications on product cards#

Open Online Store, then Themes, then Customize, then Theme settings at the foot of the sidebar, then Product specs.

These three pairs are set once and apply to every product card in the store: collection pages, search results, the Featured products section on the home page, and the product recommendation sections beneath a product. There is no per-collection override.

A card that resolves none of the three keys drops the list entirely rather than reserving space for it, so a catalog that mixes pumps with pool shells does not print three empty rows on every shell.

Note The three metafield addresses ship filled in and the switch above them ships off. Turning the switch on before you have created metafields at those exact addresses changes nothing you can see. That is the commonest reason this feature looks broken.

Everything else about card layout, including how many cards sit in a row, is on collection and search pages.

The one place the switch does not apply#

A blog article can carry up to four Product blocks, which draw small cards in the article sidebar under the heading Products in this article. Those cards always print the Spec 1 metafield value, whether or not Show specifications on product cards is on.

They print the value on its own with no label, so choose a Spec 1 value that reads without one. 26 GPM works; 26 does not. Article sidebars are covered on blog and content pages.

The specification table#

This is the full table, up to eight rows, drawn below the gallery and buy column. It is a block on the Product section: Customize, then a product template, then the Product section, then Add block, then Specification table. One per product template.

The rows#

Eight numbered groups of two settings each, Row 1 through Row 8.

Rows print in the order 1 to 8. To reorder them, retype the addresses.

The heading and the two groups#

The split counts the rows that actually appeared on this product, not the rows you configured. A product answering three of your eight rows with a split set to 4 puts all three in the first column and draws no second column at all.

What makes a row disappear#

What makes the whole table disappear#

When a product resolves no rows at all, the table does not render, and neither does its tab. You get no heading, no empty table and no Specifications tab with nothing behind it.

This is the behaviour to expect on a brand new store before any metafields exist, and on any product that carries none of the eight measurements. If a table is missing on one product and present on others, check that product's metafield values rather than the theme setting.

Whether the table appears as a tab or as a stacked band is decided by Product information display on the Product section, and covered on the product page. A single band is always stacked, because one tab is a label pretending to be a control.

Spec bars#

Up to three figures drawn as proportional fills in the buy column, so the shape of the product reads before the numbers do. Add block, then Spec bars. One per product template. Drag it in the block list to sit where you want it, above or below the price and buy buttons.

Each of the three rows has four settings.

A bar needs three things, not one#

1. A Row metafield address.
2. A Scale above zero. Leave it blank and no bar is drawn, however good the metafield value is.
3. A value on the product that begins with a number.

The theme reads the first word of the value as the figure and the rest as the unit. 80 GPM prints 80 with GPM beside it and fills the bar to 80 against your scale. Variable speed begins with a word, so nothing is drawn. A value of 0 draws nothing either.

Commas and a percent sign are stripped from the figure before it is measured, so 1,200 L reads as 1200. Because the percent sign is stripped, 80% prints as a bare 80. Write 80 % with a space, or put the sign in the label.

A value above the scale fills the bar to 100% rather than overflowing, and still prints the real number. If bars across your catalog keep hitting the end, your scale is set too low.

Note The block draws nothing at all rather than an empty bordered box when a product answers none of the three bars. Configuring three bars does not reserve three tracks on every product.

Package contents#

What is in the box, as a ruled list inside a collapsible panel in the buy column. Add block, then Package contents. One per product template.

Two metafield types work, and they behave the same on the page.

• Multi-line text. Each line becomes one row. Blank lines are ignored.
• A list type, such as a list of single line text values. Each entry becomes one row.

The block renders nothing on the storefront when the metafield is missing or empty on that product. In the theme editor you see the note "Enter a metafield with a value on this product, for example specs.package." instead, so you can find the block while you are still filling it in.

The short description in the buy box#

The Description block beside the gallery prints the product description. It is trimmed to the first paragraph only when the Full description block is on the same template, so on a template without that block the buy column carries the description in full. A metafield can replace it either way.

The block carries one setting, Short description metafield, defaulting to custom.short_description. Create that definition as Single line text or Multi-line text and fill it in per product.

When the metafield holds a value it replaces that text entirely, untrimmed: the product description is not used in the buy column and is not appended. When it is empty the description returns. Leave the setting blank to switch the metafield off across the store.

Note The text behind it changes on its own when you add the Full description block to the same template: the buy box trims itself to the first paragraph so the same prose does not print twice on one page. A description written as a single paragraph is cut to its first 40 words instead, because there is no paragraph break to cut at.

A second, independent table#

Product details is an optional section that sits below the buy box and holds long-form content in a stack of collapsible items. It carries its own Specification table block, with its own eight Row metafield and Row label pairs, unconnected to the one on the Product section.

Add it with Add section, then Product details, on a product template. It ships with two items: Description and Specification table.

Use it for the values that did not earn a place next to the price: carton dimensions, certifications, materials, whatever a buyer reads once. Two differences from the main table are worth knowing.

Each item takes a Heading and an Open by default checkbox, and an item with no heading or no content is left off the storefront entirely, with a note in its place in the theme editor. The section is listed in full on the section and block reference.

If a row does not appear#

Work through these in order. The first three cover almost every case.

1. Check the product's own value. Open the product in admin, scroll to Metafields, and confirm the field is filled in on this product. Rows resolve per product, so a table can be complete on one product and absent on the next.
2. Check the address, character for character. One dot, correct namespace, correct key, no trailing space. specs.flow_rate and spec.flow_rate are different addresses and only one of them exists.
3. Check the definition's storefront access. Settings, then Custom data, then Products, then the definition. Storefronts must be able to read it.
4. For a card row, check that Show specifications on product cards is on. It ships off.
5. For a bar, check that Scale is filled in and above zero, and that the value begins with a number.
6. For a table row, check that the value is not a lone dash.

There is no error state anywhere in this chain. A wrong address, a missing definition and an empty product field all produce the same result: the row is not on the page. That is why the order above starts with the product and works outward.

Full definitions of every setting named here are on the theme settings reference and the section and block reference. If something is still missing after all six checks, contact support.

Something wrong here If a step does not match what you see, say so and it gets fixed. Documentation goes stale, which is why the line under the title carries a date.