By default, free Shopify themes (like Dawn) display a plain “Sale” badge. You can change this to show the actual discount percentage with a small edit to the Liquid code.
- For the product page
- Go to Online Store > Themes.
- Click on the “…” button next to your current theme and select Edit code.
- Locate the snippets folder, find and open
price.liquid. - Find this line of code {{ ‘products.product.on_sale’ | t }}.
- Replace it with this code.
{%- assign percent = compare_at_price | minus:price | times: 100 | divided_by:compare_at_price | round -%}
Save {{ percent }}%
- Save your file
- For products on the collection page.
- In snippets folder, find and open card-product.liquid file.
- Find this line of code {{- ‘products.product.on_sale’ | t -}} around line 140.
- Replace the above code with this code.
{%- assign percent = card_product.compare_at_price | minus:card_product.price | times: 100 | divided_by:card_product.compare_at_price | round -%}
Save {{ percent }}%
- Save file
**Hope this is helpful!**
Best regards,
Dan from Ryviu: Product Reviews App