Display percentage off instead of sale badge [ Venture Theme ]

[alexandris]

Hello everybody !

I wanted to change my “sale” badge into “percentage” badge on my shopify store using this tutorial.

The problem is that this tutorial is not working on venture theme, or it simply has a calculation error.

I want to show you how to modify “sale” badge into “percentage” badge on venture teme:

1. From your admin, go to ‘Online Store > Actions > Edit Code’.

2. In your ‘Snippets’ folder, select ‘product-card.liquid’ file.

3. In this file, search for ‘products.product.on_sale’.

If you are using a Mac, press Command + F to search or on Windows, press Control + F.> >

4. Replace this:

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

With:

{{ product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price | money_without_currency | replace: '0,', ''| append: "% OFF"}} 

[KuldeepKumar20]

Try to using this code-

{{ product.compare_at_price_max | minus: product.price | times: 100.0 | divided_by: product.compare_at_price_max | money_without_currency | times: 100 | remove: ‘.0’}}% OFF

Thanks.

[alexandris]

When i use your code, it shows to me 0%

@KuldeepKumar20

Try to using this code-

{{ product.compare_at_price_max | minus: product.price | times: 100.0 | divided_by: product.compare_at_price_max | money_without_currency | times: 100 | remove: ‘.0’}}% OFF

Thanks.

[KuldeepKumar20]

Hi,

Are you add the compare price in your products?

See the video- https://youtu.be/jZJrCfpZgLo

Thanks.

[alexandris]

I already said that this method is not working for me. Did you read my post?

It shows me 0%

This code helped me:

{{ product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price | money_without_currency | replace: '0,', ''| append: "% OFF"}} 

[a_longhurst]

I am trying to change the sale badge to reflect the amount of money saved. So the product price minus the compare at price. I am currently moving from the supply theme to venture and the supply theme shows a badge like ‘Save £8’. I want to carry this across. Can someone help?

Many thanks

[EXOCYCLES]

hi everyone,

I have the debut theme and would also like to include a little badge that says “xx % off” instead of sale.

Please could you assist?

Kind regards,

Shakira

[gomonke]

This works for me

{% assign result = product.price | times: 1.0 | divided_by: product.compare_at_price%}
{% assign result = 1 | minus: result | times: 100 | ceil %}

[erboristeria-do]

@alexandris

I already said that this method is not working for me. Did you read my post?

It shows me 0%

This code helped me:

{{ product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price | money_without_currency | replace: '0,', ''| append: "% OFF"}} 

Hi, thank you for your help.

There is an issue when percentage of discount is under 10%

For example you don’t see -5% discount but -05% discount.

How to remove 0 in front of first number?

[plumastudio]

I use this code

{{ product.price | times: 100 | divided_by: product.compare_at_price | divided_by: 10 | remove: '.0' | append: '%' }}  

[Treasurehunter]

None of these codes are working for me in my venture theme. It just keeps showing 0% OFF.

Might it be possible for me to get in contact with a super shopify expert who can take a look at my shop for a minute?

Best regards

Kristian

[LongStroke]

Hello, Treasurehunter

Try this one:

{% if product.compare_at_price > product.price %}
{{ product.compare_at_price | minus: product.price | times: 100.0 | divided_by: product.compare_at_price | times: 100 | divided_by: 100 | floor }}% OFF
{% endif %}

[petloveRNgifts]

Your theme may already have some of the calculations done in earlier code. You could try this:

{{ product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price }}% OFF

[muetzenmafia]

Hello,

thank you for your help, this works perfect!

I only wanted to make the “15% OFF” text bould and in a different color - do you know how?

[brumisrl]

Hello,

this works for me in the collection page, but not if I use the search bar.

When I search a word appears the preview image of the products the the “on sale” label that at the moment i changed just in “%”.

I would like to let appear the percentage there as well.

I can see that label is in Locales>it.json

(trademark theme)

Any help?

Thanks

[Petsclubchile]

This one worked for me in the Debut Theme in the product listing. How do you change the “SALE” Ticket for the “XX%” in the product?

Thank you very much

[TableG]

I am using Debut theme.

I had to edit a few of the suggestions together as it was displaying on my website as 0.25% instead of 25% OFF. Here is what I used to edit the word ‘Sale’ on the sales badge to reflect ‘%OFF’

I went to ‘online store’ - ‘Action’ - ‘Edit Code’ to the ‘Snippets’ under snippets I navigated to ‘product-price-listing.liquid’

As highlighted. On line 113 it came up as {{ 'products.product.on_sale | t }}

I replaced it the full text on line 113 with the text below.

{{ product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price | money_without_currency | replace: ‘0’, ‘’| remove: ‘0.’ | append: “% OFF”}}

This is what it looked like on my website in the end

Hope that helps someone!

Update! I had to do the same thing in ‘product-price.liquid’ under line 81 which stated

I replaced the text underneath it. As a couple of my products were still showing up with ‘0.’

[cygniz]

This one worked for me. I changed in both product-price-listing. liquid and in product-price.liquid. I’m using debut theme. I used page inspect and made some changes according to my need.

search for 'products.product.on_sale and replaced the whole line

Thank you

[MuhammadAlie]

Thanks..This work for me (use avone Theme)

[mentanovedades]

I have the Drawn theme but when I enter the code the percentage does not appear or it appears 0% how can I fix this?