How to Create a Custom “What’s Included” List Using Metafields

Want to show a clean, customizable “What’s Included” list on product pages? This tutorial shows you how to let store owners add items via Product metafields, which then automatically render on the product page.

📌 Step 1 — Create Your Product Metafield (List of Text)

In Shopify Admin, open:

Settings → Custom data → Products → Add definition

Create a metafield with the following settings:

• Name: What’s Included List
• Namespace & key: custom.whats_included
• Content type: Text → List of values
• Validation: Leave default

Click Save.

Now go to any product and you’ll see a metafield where you can add values like:

• Charging Cable
• Instruction Manual
• Protective Case

📌 Step 2 — Add the Code to Display the “What’s Included” List

Open your product template section:

Online Store → Themes → Edit Code  
→ sections → main-product.liquid  
(or product-template.liquid, depending on your theme)

Add this block wherever you want the list to appear:

{% if product.metafields.custom.whats_included != blank %}
  <div class="whats-included-section">
    <h2 class="whats-included-title">What's Included</h2>
    <ul class="whats-included-list">
      {% for item in product.metafields.custom.whats_included %}
        <li class="whats-included-item">{{ item }}</li>
      {% endfor %}
    </ul>
  </div>
{% endif %}

This automatically loops through each metafield value.

📌 Step 3 — Add Styling for the Section

Add this CSS either inside the same file or your theme’s stylesheet:

<style>
.whats-included-section {
  margin-top: 35px;
  padding: 20px 25px;
  background: #f9f9f9;
  border-radius: 10px;
}

.whats-included-title {
  margin-bottom: 15px;
  font-size: 24px;
  font-weight: bold;
}

.whats-included-list {
  margin: 0;
  padding-left: 20px;
}

.whats-included-item {
  margin-bottom: 8px;
  font-size: 16px;
  line-height: 1.4;
  list-style-type: disc;
}
</style>

You now have a clean, flexible “What’s Included” feature that matches any theme.

📌 Step 4 — Add Items to Any Product

Go to:

Products → Any Product → Scroll Down → Metafields

Add your list items one by one:

• Item #1
• Item #2
• Item #3

The product page will instantly reflect your list.

🎉 You're Done!

You’ve created a dynamic, easy-to-update What's Included system using metafields. Store owners can now update product contents without touching code!

• Ideal for bundles
• Electronics kits
• Subscription boxes
• Product sets

Metafield-powered features like this help merchants stay flexible and save time.