Adding a different discount/sale label depending on product tag

Store Design
, , , ,

Topic summary

A user successfully implemented conditional discount labels on product cards based on product tags. The goal was to display different labels: the default “Sale” for some products and a custom “Rebate” label for products from suppliers who prefer alternative terminology.

Initial Challenge:

  • Attempted to filter products using tags within the card-product.liquid snippet
  • Created a custom color scheme (badge_rebate_color_scheme) and added translations (products.product.rebate)
  • Code wasn’t triggering the conditional display correctly

Solution Found:

  • Assigned all product tags to a variable first: {%- assign tags = card_product.tags -%}
  • Then checked if that variable contains the target tag (e.g., ‘NEW’)
  • This two-step approach allowed proper filtering and conditional label display

Final Implementation:
The working code uses elsif conditions to check: compare_at_price > price, product availability, and whether the tags variable contains specific values. This displays the appropriate badge with custom styling and translated text based on product tagging.

Summarized with AI on November 3. AI used: claude-sonnet-4-5-20250929.
1

Hello all,

Been trying to add a second discount/sale label that would appear in product cards, since for some products we want to keep the default “Sale”, and for other products we have suppliers that provide rebates, and they would strongly prefer having not having “Sale” verbiage. I’ve tried a few different ways of selecting these different products, to no avail. Here is the code I currently have:

          {%- elsif card_product.compare_at_price > card_product.price and card_product.available and card_product.tags contains 'NEW' -%}
            <span
              id="Badge-{{ section_id }}-{{ card_product.id }}"
              class="badge badge--bottom-left color-{{ settings.rebate_badge_color_scheme }}"
            >
              {{- 'products.product.rebate' | t -}}
            </span>

This is in card-product.liquid, nestled between what adds the “Sold Out” and “Sale” labels. I have already added products.product.rebate to en.default, and have rebate_badge_color_scheme defined as something different than the sale color scheme, but neither appear to change on the website. If someone could let me know what I’m doing wrong, that would be greatly appreciated, thanks!

2

Hi @alpinecamera :waving_hand: try just outputting the assumed values {{ card_product.compare_at_price }} etc to validate they are what you think they are.

Start higher in the files then work your way in templates>sections>snippets; for json templates use custom-liquid settings or blocks if suitable.

Beyond that If you need this customization or theme repair then contact me for services.
Contact info in forum signature.
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.

1 Like
3

Was actually able to get this working, was on the right track but just needed to add an extra step. Took the solution from this thread, added in a variable that’s just all the tags of the product, and now it can correctly filter by that tag using that variable, and display a special card.

This is the code I ended up with:

{%- assign tags = card_product.tags  -%}

...

 {%- elsif card_product.compare_at_price > card_product.price and card_product.available and tags contains 'new' -%}
            
              {{- 'products.product.rebate' | t -}}