Change 'on sale' badge text to percentage discount

GeorgeRizos
Pathfinder
128 1 19

I would like to show a xx% off badge that's correct on every product. 

Screenshot 2023-10-24 092725.png

At the moment I thought entered this text.

Screenshot 2023-10-24 092826.png

website url: https://thesnoozy.com/

 

Dawn theme

Replies 9 (9)
GeorgeRizos
Pathfinder
128 1 19

@Softtech 

So instead of saying £25 Off. I would like for it to say X% Off. So on every product the percentage discount is relevant to the price of the product. 

 

Not all of my products have the same amount discount

GeorgeRizos
Pathfinder
128 1 19

I mean, I built the store that im showing you now. Is that experience?

Dan-From-Ryviu
Shopify Partner
5570 1021 1053

Hi @GeorgeRizos 

Please go to your Online store > Theme > Edit code > card-product.liquid file, find this line of code 

 

{{- 'products.product.on_sale' | t -}}

 

Replace this code below this  

 

{%- assign percent = card_product.compare_at_price | minus: card_product.price | times: 100 | divided_by: card_product.compare_at_price | round -%}
Save {{ percent }}%

 

 

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

GeorgeRizos
Pathfinder
128 1 19

Hi there @Dan-From-Ryviu ! 

 

Thanks for the reply. When I go to that folder. this code: {{- 'products.product.on_sale' | t -}}

 

is shown twice in the file.

 

Do I replace it on both?

Dan-From-Ryviu
Shopify Partner
5570 1021 1053
You can try replace code one by one to check

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

GeorgeRizos
Pathfinder
128 1 19

Hi @Dan-From-Ryviu ! It works on the product list page. But when I click on a specific product and go to the product page it turns back to the before badge

Dan-From-Ryviu
Shopify Partner
5570 1021 1053

Hi, please replace the same code in price.liquid file for product page 

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now

GeorgeRizos
Pathfinder
128 1 19

hi @Dan-From-Ryviu , it does give a percentage but no number

 

Dan-From-Ryviu
Shopify Partner
5570 1021 1053

Do you want to it appear bot % off and number amount discount off? 

- Helpful? Like and Accept a solution. - Donate: Buy coffee - or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now