Skip to content

Use metafields on product pages

This guide describes adding a metafield into a product page template, to display additional information about a product on a store's product page.

For example, in the following image, a custom metafield displays the manufacturer's part number MPN: 12345 for a product on a store's product page.

An example product page with a custom metafield.

Metafields store information. For example, you can create a metafield to store information about a product's physical dimensions. By adding metafields to blocks inside a product page template, the information from the metafields can be displayed on your store's product pages. Refer to Shopify help: Using metafields and dynamic sources.

Note

To specify the information that's stored in a metafield, shopify provide standard metafield definitions. Refer to Shopify help: Adding standard metafield definitions .

You can also create custom metafield definitions. Refer to Shopify help: Creating custom metafield definitions.

As an example, this guide creates a custom metafield definition to store a manufacturer's part number (MPN) for a product. The MPN is displayed inside a text block on a product page. To create a different custom metafield, adapt the steps in this guide to suit your requirements.

Define a product metafield

To define a product metafield:

  1. In your store's admin, go to Settings > Metafields.

    The Settings menu in Shopify admin.

  2. On the Metafields page, select Products, and then choose Add definition.

    The Products metafield definitions page in Shopify admin.

  3. In the Name text box, enter a name for the metafield.

    For example, to create a metafield for a manufacturer's part number (mpn), in the Name text box, enter mpn.

    Note

    You can also select a standard definition with a content type that corresponds to the information you want the metafield to store. For example, Shopify provide standard definitions for storing International standard book numbers (ISBN), Product guides, Product subtitle, etc.

    For a list of standard definition and content types, refer to Standard metafield definitions.

    [Optional] In the Description text box, enter text to describe the metafield. For example, enter Manufacturer's part number.

    The metafield definitions page in Shopify admin.

  4. Choose Select content type.

    The Select content type button on the metafield definitions page in Shopify admin.

  5. From the list, select the type of content for the metafield to use.

    For example, to set the mpn metafield to store numbers, select Number from the content type list.

    A list of content types on the metafield definitions page in Shopify admin.

  6. Where relevant, set the required options and validation rules to define the metafield.

    For example, to set the mpn metafield to use five digit intergers, select the Interger checkbox. In the Minimum value text box, enter 00000. In Maximum value text box, enter 99999.

    Note

    Depending on the metafield's content type, different options and validation rules are displayed.

    An example of a completed metafield definitions page in Shopify admin.

  7. Select Save from the Unsaved changes menu at the top of the page.

Set values for the metafield

To set values for the metafield:

Note

The steps required to set values depend on the metafield's content type. Refer to Adding values to metafields. Adapt the following steps to suit your requirements.

  1. In your Shopify admin, select Products.

  2. Select a product from the product list.

  3. At the bottom of the page, locate the Metafields area.

    The metafields area of a product page in Shopify admin.

  4. Select a metafield from the list, and then enter the required values.

    For example, select the mpn metafield, and then enter the value 12345 into the text box.

    Example values in the metafields area of a product page in Shopify admin.

    Note

    Depending on the metafield's content type, different options are displayed for entering values. Refer to Adding values to metafields.

  5. Select Save.

Add the metafield to product pages

To add the metafield to a product pages' block:

  1. In theme editor, at the top of the page, use the dropdown to select a page that contains a Product pages section. Refer to Product pages.

    For example, select Products > Default product > Product pages.

  2. From the Product pages section menu, select a Text or Rich text block to contain the metafield.

    Alternatively, to add a new block, select Add block > Text or Rich text, and then select the block you added. Refer to Configure, add, remove, hide, show, move or duplicate blocks and sections.

    The Product pages section menu in Theme editor.

  3. Inside the block settings menu, select the icon Insert dynamic source.

    The text block settings menu in Theme editor.

  4. From the Insert dynamic source menu, select a metafield, and then choose Insert.

    For example, select the mpn metafield.

    The Insert dynamic source menu, inside text block settings, in Theme editor.

    [Optional] In the Text box, enter a prefix for the metafield value. For example, in the text box, enter the prefix MPN:.

    Example prefix text added to a Text box, inside the text block settings, in Theme editor.

  5. Verify that the metafield displays on the product page.

    An example product page with a custom metafield.

Note

To set how the block containing the metafield is displayed, refer to Configure, add, remove, hide, show, move or duplicate blocks and sections.

To set how the metafield displays on all product pages, refer to Settings > Products, and Shopify help: Displaying metafields on your online store.