How can I fix a sale badge issue based on tags on my homepage?

Store Design
1

hello,

I’ve got a problem with the sale badge on the collection pages.

My customer asks me to have the possibility to define a discount base on some tags.

So I’ve added this code to the price.liquid snippets

{%- if show_badges -%}
<span class="badge price__badge-sale color-{{ settings.sale_badge_color_scheme }}">
{% if collection.handle == "0-5" or product.tags contains "0.5" %}
-50%
{% elsif collection.handle == "0-4" or product.tags contains "0.4" %}
-40%
{% elsif collection.handle == "30" or product.tags contains "0.3" %}
-30%
{% else %}
-20%
{% endif %}
</span>
<span class="badge price__badge-sold-out color-{{ settings.sold_out_badge_color_scheme }}">
{{ 'products.product.sold_out' | t }}
</span>
{%- endif -%}

Then I’ve added the discount base on the same rule.

And it works both on the product page and in the cart.

Mktg_0-1681732432679.png
Mktg_0-1681732432679.png1920×946 196 KB

you can see live here.

But the same product on the home page has got a 20% discount sale badge.

Mktg_1-1681733012006.png
Mktg_1-1681733012006.png1920×951 222 KB

So I go to the card.product.liquid file and add some code.

<div class="card__badge {{ settings.badge_position }}">
{%- if card_product.available == false -%}
<span
id="Badge-{{ section_id }}-{{ card_product.id }}"
class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}"
>
{{- 'products.product.sold_out' | t -}}
</span>
{%- elsif card_product.compare_at_price == card_product.price and card_product.available -%}
<span
id="Badge-{{ section_id }}-{{ card_product.id }}"
class="badge badge--bottom-left color-{{ settings.sale_badge_color_scheme }}"
> {% if collection.handle == "0-5" or product.tags contains "0.5" %}
-50%
{% elsif collection.handle == "0-4" or card_product.tags contains "0.4" %}
-40%
{% elsif collection.handle == "30" or card_product.tags contains "0.3" %}
-30%
{% else %}
-20%
{% endif %}
</span>

But it doesn’t work.

Can someone help me, please?