How to display sale badge and discount on Stiletto theme?

Store Design
1

Dear,

I’m using the Stiletto Shopify Theme for my webshop and I’m searching for a way to display my ‘sale’ badge & discount on the overview page and my product page.
I’ve activated all the settings in the theme settings, tried different things, but I still can’t figure out why the theme is not displaying my sale badge and discount.

The discount is available as the only moment it is been showed is in your cart at moment of check-out. Can someone please help me to figure it out and get this badge and discount on my website please.
Thank you in advance!

E.g. Product with discount: https://www.byavelien.be/products/straight-jeans-beige?_pos=1&_psq=straig+&_ss=e&_v=1.0

2

hello there

To display your sale badge and discount on the overview page and product page of your Stiletto Shopify theme webshop, you can try the following steps:

  1. Go to your Shopify admin panel and click on Online Store > Themes > Actions > Edit code.

  2. In the left-hand sidebar, click on Snippets and find the “product-card-grid-item.liquid” file.

  3. Find the code that displays the product title and add the following code below it:

{% if product.compare_at_price > product.price %}
  SALE

{% endif %}
  1. To display the discount amount on the product page, find the code that displays the product price and add the following code below it:
{% if product.compare_at_price > product.price %}
  Save {{ product.compare_at_price | minus: product.price | times: 100.0 | divided_by: product.compare_at_price | money_without_currency }}%

{% endif %}