How To Add Another "Red" Price To The Product Title When The Product Is On Sale?

[KimGottwald]

Hello,

can someone tell me how to add this modification to the product when its on sale?

How it looks now:

How it should look:

Im using the Brooklyn theme: aliudclothing.com

Thank you!

Kim

[Dan-From-Ryviu]

Hi @KimGottwald 

Go to your Online store > Themes > Edit code > open product-grid-item.liquid, find this line of code 

{{ product.price | money_without_trailing_zeros }}

Replace it with this code 

<span style="text-decoration: line-through;">
{{ product.compare_at_price | money_without_trailing_zeros }}
</span>
<span style="color: red;">
{{ product.price | money_without_trailing_zeros }}
</span>

Save your file  

[KimGottwald]

Thank you, sadly also the normal prices are now red, how can I change that?

[Dan-From-Ryviu]

Please update previous code to this 

{% if on_sale %}
  <span style="text-decoration: line-through;">
  {{ product.compare_at_price | money_without_trailing_zeros }}
  </span>
  <span style="color: red;">
  {{ product.price | money_without_trailing_zeros }}
  </span>
{% else %}
  {{ product.price | money_without_trailing_zeros }}
{% endif %}

[KimGottwald]

Please help.

[Dan-From-Ryviu]

Please update code like this 

            {% if on_sale %}
              <span style="text-decoration: line-through;">
              {{ product.compare_at_price | money_without_trailing_zeros }}
              </span>
              <span style="color: red;">
              {{ product.price | money_without_trailing_zeros }}
              </span>
            {% else %}
              {{ product.price | money_without_trailing_zeros }}
            {% endif %}