Custom data

Metafields are extra fields you can add to products and collections. Nook reads a few of them so furniture pages can show measurements, and collection pages can show a tagline and key figures. Anything left empty isn't shown.

Choose how to set it up

You don't have to use Nook's metafield names. There are three ways, and you can mix them:

1. Use metafields you already have. If your products already store measurements in metafields (for example from an import or another app), connect them in the theme editor. Select the Fit note block or the Dimensions tab, then choose Connect dynamic source next to each measurement and pick your metafield. Dimension, number and text metafields all work. Do the same for the Collection intro section's Tagline.
2. Type a value. For a store where one measurement is the same for every product using a template, type it into the setting with its unit, for example 36 in.
3. Create Nook's definitions. Create the metafields listed below. The theme reads them automatically, with nothing to connect. This is the quickest option for a new store.

While you're in the theme editor, the Fit note block and the Dimensions tab show a short note when a product has no measurements yet, so you can see what to add. Shoppers never see the note.

For care instructions, you can also use Shopify's standard Care guide definition: in Settings › Custom data › Products, choose Add definition, then pick Care guide from the suggested definitions. Connect it to the Care tab.

Create the definitions

1. In the Shopify admin, go to Settings › Custom data.
2. Choose Products (or Collections), then Add definition.
3. Enter the name, then set the Namespace and key exactly as shown below. The namespace is always custom.
4. Choose the type, then Save.

Product metafields

Use the same unit (inches or centimeters) for all your products. The theme shows the unit you enter.

To fill in many products at once, export your products as a CSV file, add a column for each metafield (Shopify names them like Width (product.metafields.custom.width)), fill them in, then import the file. Create the definitions first.

Where each one appears

• Product cards and the product image: read the metafields named in Theme settings › Product cards › Width metafield, Depth metafield and Height metafield (custom.width, custom.depth and custom.height by default). If your measurements live elsewhere, enter their namespace and key there, such as specs.width; dimension, number and text metafields all work. With Theme settings › Product cards › Show dimension line on, cards show the measurements under the product name, for example "W 86 in · D 38 in · H 32 in". The line appears when the product has a width; depth and height are added when they're filled in.
• Measurements on the product image: with the product page's Show measurements on the first image on, the first image carries dimension lines labeled with the width (along the bottom) and the height (up the side), from the same metafields as product cards.
• Dimensions tab: the product page's Collapsible tab block with Show product dimensions on lists width, depth, height, seat height and narrowest point. Its own settings, if connected or filled in, take priority over these metafields.
• Fit note: the product page's Fit note block shows the narrowest point (its Narrowest point setting takes priority) and a Check it fits your doorway link. It opens a fit checker where shoppers enter their doorway, hallway and stairwell widths. The check runs in the shopper's browser; nothing is sent to you.
• Lead time: shows under each item in the cart, from the metafield named in Theme settings › Cart › Lead time metafield (custom.lead_time by default; leave it empty to hide lead times). To show it on the product page too, connect it in the Text block (for example "{lead time} · Free delivery"). Products without a lead time simply leave it out.
• Materials and Care: connect these to the Materials and Care tabs in the default product template (see below). The tabs stay hidden until they have content.

Connect a metafield to a tab

1. In the theme editor, open a product page and select a Collapsible tab block.
2. Next to Content, choose the Connect dynamic source icon.
3. Pick the metafield.

Each product then shows its own content in that tab.

Collection metafields

Both appear in the Collection intro section at the top of collection pages.

Swatches

Color and fabric swatches come from Shopify's product category metafields, not from the theme. Set the product's category (for example Sofas), fill in a category metafield such as Color, then link it to the product's option. Each value can have a color or an image. How they look is set by the product page's Swatch style setting. See Product pages.