Create Product Metafield List Object

[Rich152]

 

Hi everyone,
I’m currently looking to add a custom field to each product where users can input multiple entries. For each entry, I want the user to be able to input two fields: one for text and one for a product link — similar to an ACF repeater in WordPress.

Here’s an example of the kind of field I’m aiming for.

https://au.shopcsb.com/collections/new-arrivals/products/freedom-selena-crop-black?variant=421946664...
I’d really appreciate any help or suggestions!

[goldi07]

Hello @Rich152 

To achieve functionality similar to an ACF repeater in Shopify—allowing for multiple entries of two fields (text + product link) per product—you can use Shopify’s Metafields with a definition of a list of objects.

Here's how you can create a custom metafield definition and use it in your theme:

1. Define a Custom Product Metafield in Admin
Go to your Shopify admin:

. Settings → Custom data → Products → Add definition

. Name: e.g., Related Items

. Namespace and key: custom.related_items

. Content type: List of Objects

. Add the following fields to the object:

. Text field (label: Label, type: single-line text)

. Product field (label: Product Link, type: product reference)

Make sure the definition is visible in the product admin so it can be filled per product.

2. Example of JSON Structure Behind the Scenes
Once populated, the metafield might look like this in Liquid:

[
  {
    "label": "Goes well with Freedom Shorts",
    "product": {
      "id": 123456789,
      "handle": "freedom-shorts"
    }
  },
  {
    "label": "Perfect with Selena Leggings",
    "product": {
      "id": 987654321,
      "handle": "selena-leggings"
    }
  }
]

3. How to Render This in Liquid (Product Page)
In your product.liquid or section file like main-product.liquid, insert:

{% if product.metafields.custom.related_items != blank %}
  <div class="related-items">
    <h4>Related Items</h4>
    <ul>
      {% for item in product.metafields.custom.related_items %}
        <li>
          <strong>{{ item.label }}</strong><br>
          <a href="{{ item.product.url }}">{{ item.product.title }}</a>
        </li>
      {% endfor %}
    </ul>
  </div>
{% endif %}

Tips
. This is native and scalable—doesn’t require apps or third-party tools.

. You can style it with CSS, or place the block wherever appropriate in your layout.

. If you're using Shopify's Online Store 2.0, you can create a custom Liquid block in a section and let merchants move it around.

Thank you 😊

[Rich152]

 thank you so much but my store dont have List of Objects; As for using JSON, I’ve tried it, but users find it difficult to understand how to use it. Do you have any advice for me?

[goldi07]

Thanks for the clarification — you're right. Shopify's standard metafields interface does not support a native “List of Objects”, but it does support references to Metaobjects, which is exactly what you’re seeing in your screenshot.

Best Solution: Use Metaobjects
Since your store supports Metaobjects, you can absolutely achieve an ACF-style repeater using them — in a user-friendly way. Here's the clean approach:

Step-by-Step: Setup with Metaobjects
1. Create a Metaobject Definition
Go to:
Settings → Custom data → Metaobjects → Add definition

Example:

. Name: Related Product Note

. Fields:

. Text field: Label (e.g., “Pairs well with Freedom Shorts”)

. Product reference field: Product

Save it and allow entries for this metaobject type.

2. Link the Metaobjects to Products
Now go to:
Settings → Custom data → Products → Add definition

Create a new Metafield:

. Name: Related Items

. Type: List of Metaobjects

. Reference type: Related Product Note (the metaobject you just created)

This allows you to add multiple entries per product via a simple UI:

. Text label

. Linked product

No raw JSON required — just click + Add entry.

3. Display in Your Theme (Liquid)
Use this in your product template:

{% assign related_items = product.metafields.custom.related_items.value %}

{% if related_items != blank %}
  <div class="related-items">
    <h4>Related Items</h4>
    <ul>
      {% for item in related_items %}
        <li>
          <strong>{{ item.label }}</strong><br>
          <a href="{{ item.product.url }}">{{ item.product.title }}</a>
        </li>
      {% endfor %}
    </ul>
  </div>
{% endif %}

Make sure custom.related_items matches your actual metafield namespace/key.

Why This Works Well
. Easy for non-technical users to fill out in the Shopify Admin.

. Supports multiple entries, each with distinct fields.

. Avoids JSON headaches.

. Future-proof and scalable (can be reused across products, collections, etc.).

Thank you 😊