How to add new product badges

If you are after adding new product badges similar to the Shopify default "Sale" and "Sold out", we've added the "New" and "Pre order" badges in theme version 1.1.8. 

For older theme versions:

  1. Go to the theme editor (read this article for more info)
  2. Choose  /snippets/product_badges.liquid and replace the contents of the file with the following:

    {% unless product.available %}
      <div class="product-badge sold"><span>{{ 'product.sold_out' | t }}</span></div>
    {% else %}
      {% if product.compare_at_price > product.price %}
        <div class="product-badge sale"><span>{{ 'product.on_sale' | t }}</span></div>
      {% elsif product.tags contains 'preorder' %}
        <div class="product-badge preorder"><span>Pre Order</span></div>
      {% elsif product.tags contains 'new' %}
        <div class="product-badge new"><span>New</span></div>
      {% endif %}
    {% endunless %}
  3. Change the new words after your own desire and then save the file.
  4. From this point, if you tag a product "new" or "preorder" (screenshot), you will see this badge in the grid.

In case you need more product badges you can simply add new conditions in the code  (make sure to insert the code before the {% endif %} ):

{% elsif product.tags contains 'more options' %}
   <div class="product-badge more options"><span>More options</span></div>

Please see this screenshot if it might help.