How to Create Dynamic Product Labels Using Metafields in Shopify


Want to display eye-catching labels like “New,” “Hot,” “Limited,” or “Best Seller” on your Shopify products — all without installing a third-party app? In this tutorial, I’ll show you how to do it using Shopify Metafields, the built-in way to store custom product data.

Let’s go 👇


Step 1: Create a Custom Metafield for Labels (Dawn Theme)

  1. In your Shopify Admin, go to:
    Settings > Custom data > Products
  2. Click Add definition
  3. Fill in the fields:
    • Name: Product Label
    • Namespace and key: custom.label
    • Content type: Single line text
  4. Click Save

This creates a custom metafield that you can fill for any product.


Step 2: Add a Label to a Product

  1. Head over to Products in your Shopify admin
  2. Click on a product
  3. Scroll to the Metafields section (at the bottom)
  4. You’ll see your Product Label field
  5. Enter a label, e.g. 🆕 New, 🔥 Hot, or 💎 Exclusive
  6. Save the product

You can leave it blank if you don’t want any label shown for a product.


Step 3: Update Your Theme Code to Display the Label

We’ll now tell your theme to look for that metafield and show it on your product cards.

Open your theme code:

  1. Go to Online Store > Themes
  2. Click Actions > Edit code
  3. Find the file where your product card layout lives — usually something like:
  4. add the code in main-product.liquid

Add this code where you want the label to appear:

{% if product.metafields.custom.label %}
  <span class="product-label">
    {{ product.metafields.custom.label }}
  </span>
{% endif %}

Place it above or next to the product title/image — wherever you want the label to appear.


Step 4: Style Your Labels with CSS

Let’s add a little flair.

Find your theme’s CSS file (usually under assets/theme.css or base.css) and paste this:

.product-label {
  display: inline-block;
  background-color: #ff4081;
  color: white;
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 30px;
  margin-bottom: 10px;
  text-transform: uppercase;
}

Feel free to tweak the colors and fonts to match your brand.


Bonus: Label Ideas You Can Use

LabelWhen to Use
🆕 NewRecently added products
🔥 HotTop-selling products
💎 ExclusiveLimited or special edition items
🛒 On SaleDiscounted items
🚫 Sold OutOut of stock items (with condition)

Conclusion

Using metafields to add product labels gives you complete control without relying on third-party apps. It’s lightweight, fast, and super flexible.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.