How to show % discount on a product using debut theme

Shopify Discussion
21

FB_IMG_1593659256740.jpg
FB_IMG_1593659256740.jpg1072Ɨ597 26.9 KB

Hai. You know how to make this 60% off and this big Buy Now button?

22

BTW, your percentage calculation comes out inversed if the discount is more than 50%. In my store it should come out to 63%, it came out to 37%.

23

Hi Tejas

I have tried many codes but it did not work out. Please help me with your code:

  1. Where to insert your code?

My domain is teacherhero.net

24

hello

here is my site.

https://suubula.com/

I put the code but it is not working.

25

Hello there!

I have the same problem, With debut theme I cannot see discount prices on my store www.pepitocat.com, can anyone help please? I have already tried to add the code mentioned in previous comments but dinā€™t work.

Thank you very much

Cristina

26

Hi tejas,

How can I show the discount % off on Collection page? I want to display on top left side of the product images on collection page. Please help.

Thanks.

27

can someone help me to edit the code ?? because i tried to add this after line 12 and nothing is workingā€¦

here is my code


  {%- if variant.compare_at_price > variant.price -%}
    {{ 'products.general.regular_price' | t }}
    
      
        {{ variant.compare_at_price | money }}
      
    
    {{ 'products.general.sale_price' | t }}
  {%- else -%}
    {{ 'products.general.regular_price' | t }}
    
      
    
    {{ 'products.general.sale_price' | t }}
  {%- endif -%}

 
  
    {{ variant.price | money }}
  

  

    {%- capture unit_price_separator -%}
      / {{ 'general.accessibility.unit_price_separator' | t }} 
    {%- endcapture -%}

    {%- capture unit_price_base_unit -%}
      
        {%- if variant.unit_price_measurement -%}
          {%- if variant.unit_price_measurement.reference_value != 1 -%}
            {{- variant.unit_price_measurement.reference_value -}}
          {%- endif -%}
          {{ variant.unit_price_measurement.reference_unit }}
        {%- endif -%}
      
    {%- endcapture -%}
    
      {{ 'products.general.unit_price' | t }}
      {{ variant.unit_price | money }}{{- unit_price_separator -}}{{- unit_price_base_unit -}}
28

The issue with the above solution is that the % off shown is too high. To avoid misleading customers, you should make sure that the displayed discount is rounded down. This works well:

assign percentDiscount = comparePrice | minus: price | times: 0.10 | divided_by: comparePrice | times: 1000.00 | floor
29

Hello sir

Want to make some changes in my shopify storeā€™s product page..

We have a unique buy it now button on the product page & it is named with ā€™ PAY ONLY 25% NOW & REST CODā€™

What we offer is, that if someone clicks on this button, 75% discount code will be automatically applied to its cart and customer will only have to pay 25% payment

And the change we want is in the button, we want this button to show discounted product price.

For example - Product price is 1000 INR

What we want is, that button text should be ā€™ PAY ONLY 25% ( 250 INR ) NOW & REST CODā€™

we want to add discounted product price on the button .

Please assist us in this matter

We would be highly thankful to you

Our storeā€™s URL - https://lamansh.in

Thank you

Regards

Nikhil jain

Lamansh.in

lamansh.in@gmail.com

30

Hi, So I have added the code into the product page and for a product, with a single variant it works well, but I am trying to put it on a product that has 3 variants and it does not refresh when the buyer clicks the other variant only if I refresh the page does it show the correct percentage.

How can we make this work.

Also is there code to say how much the difference is between the price and compare at price so an actual figure of 3ā‚¬ for example displayed after the % discount that is calculated as above when the user switches between the variants?

31

Hi Everyone,

I am using Live theme. May I know how to show % discount on every product. And How to make proper layout of qty and add to cart button on home page. Please help me to fix this.

Thank you.

32

Hello Ankur, your solution worked fine for me. An additional question. Is there a way to show the discount text in a different color or with Bold Style? Thanks a lot for your help

33

its not working on my site url :www.smithandblake.com

34

Hi,

Canā€™t get this working, I am using theme Brooklyn.

Hereā€™s the url www.bakstur.fo

please help.

35

Hello Everybody!

I am currently using the them Canopy. But my theme does not show anywhere Sections > product-template.liquid file or Assets > product-price.liquid file. Therefore Im not able to paste the above code anywhere. Does anybody have an idea and can help me please.

Thanks a lot !

Blanca

36

Didnā€™t work on my theme (Cart). Can you please help? I want to change the ā€œSaleā€ button thatā€™s in green to show the % of discount for that product. https://www.discountpricesus.com/collections/jewelry

37

Hi @Lovelyn12 Iā€™m not sure if this is what you are looking for but this app Codeboost I use letā€™s you promote discount codes across your website really well. You can add custom messages including the percentage the discount code will apply on the eligible products, fully customizable.

I like it because I do not have to modify any theme code.

Description from marketplace:

Codeboost will allow you to display badges and messages above eligible products in the collections page, product page and cart page. Additionally you can only show these promotions selectively and privately to specific customers!

Hopefully this helps!

38

Tejas, I am trying to do a similar thing can you help me with my website?

39 
{% assign diff = product.compare_at_price | minus: product.price %}
{{ diff | times: 100.0 | divided_by: product.compare_at_price | split: '.' | first }}%
40

How do you do this on the Dawn theme? Thank you