Need a Shopify Expert?

Stuck or don’t have the time? I’ll personally implement this solution for you with my expert hands - for just $30.

💬 Message me on WhatsApp

Create Custom Product Labels and Badges in Shopify Without Any App

We will create custom product labels and badges in Shopify without any app using metafield and metaobject with a few lines of code.

Steps

1. Go to store settings → Custom Data
2. Add Metaobject definition named as Label
   • Add Single line text field named as Title (should use one value)
   • Then add a color field named as Color
3. Add Products Metafield definition named as Labels
   • Select the type as MetaObject and reference as Label metaobject
   • Select list of entries
4. Create a snippet named as: product-label.liquid
   • Use the following snippet:

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

<div class="product-labels">
  {% for label in labels %}
    {% assign background_color = label.color %}
    {% assign color_string = "" | append: background_color %}
    {% assign text_color = color_string | color_lighten: 100 %}
    <small class="product-label" style="background-color: {{ background_color }}; color: {{ text_color }};">
      {{ label.title }}
    </small>
  {% endfor %}
</div>

Video Tutorial

Watch the step-by-step video tutorial here:

Need a Shopify Expert?

Stuck or don’t have the time? I’ll personally implement this solution for you with my expert hands - for just $30.

💬 Message me on WhatsApp