How To Change Sale Badge on product page to 50% Off?? Venture Theme

flavoursy
New Member
7 0 0

You see the SALE badge? how can i change this to 50% off instead?vvvvvvv.PNG

0 Likes
SobefyOscar
Shopify Partner
113 11 33

Find the "sale" code within your product.template file and replace the text with this liquid logic. What this does is calculate the percentage off and display the result right next to the % symbol. 

 

 

{% if product.compare_at_price_max > product.price %}{{ 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'}} %{% endif %}

This will do the trick. If it works, please accept this as a solution. 

 

 

Want to customize or make changes to a theme? Hire me.
If my answer was helpful please Like and Accept Solution.
Email: oscar@sobefy.com
Website: Sobefy.com
0 Likes
PremierStores
Shopify Partner
270 26 47

Hi, @flavoursy

You need to edit your product-temlate.liquid, replace lines 93 to 97 with this:

<li id="ProductSaleTag-{{ section.id }}" class="{% unless current_variant.compare_at_price > current_variant.price %}hide{% endunless %}">
              <div class="product-tag">
                {{ current_variant.compare_at_price | minus: current_variant.price | times: 100 | divided_by: current_variant.compare_at_price| ceil | append: '% OFF' }}
              </div>
            </li>


On theme.js at line 2989 replace $(this.selectors.saleTag).removeClass('hide'); with this:

$(this.selectors.saleTag).removeClass('hide').find('.product-tag').html(
            Math.round(((variant.compare_at_price - variant.price) * 100) / variant.compare_at_price ) + '% OFF'
          );


If you need more assistance don't hesitate on send us an email, we will reply you as soon as possible.

Let's make the best store!
Contact us at: thepremierstores@gmail.com
0 Likes
flavoursy
New Member
7 0 0

I couldnt get it to work?

 

it still says Sale on my product page ;/

0 Likes
flavoursy
New Member
7 0 0

im not sure what the sale snippet code is, i have no experience at all with html

0 Likes
SobefyOscar
Shopify Partner
113 11 33

As the comment above

Want to customize or make changes to a theme? Hire me.
If my answer was helpful please Like and Accept Solution.
Email: oscar@sobefy.com
Website: Sobefy.com
0 Likes

Hello @flavoursy,

1. Go to Online Store->Theme->Edit code
2. Sections->product-template.liquid

Search below code

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

Replace this code with below code

{% if product.variants.size > 1 %}
  UP TO {{ product.compare_at_price_min | minus: product.price | times: 100.0 | divided_by: product.compare_at_price_min | money_without_currency | times: 100 | replace: '.0', '' | append: "% OFF"}}
  {% else %}
    {{ product.compare_at_price_min | minus: product.price | times: 100.0 | divided_by: product.compare_at_price_min | money_without_currency | times: 100 | replace: '.0', ''| append: "% OFF"}}
{% endif %}
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
PremierStores
Shopify Partner
270 26 47

@flavoursy we've sent you a private message.

Let's make the best store!
Contact us at: thepremierstores@gmail.com
0 Likes
Seniorita
New Member
4 0 0

Hello, I need some help please.
Somehow, the product that I have not added a compare to price still have a badge "-0%".
Can you please help me to disable this badge for the items that are not on sale ?

Thank you in advance

0 Likes
fercamassari
New Member
1 0 0

Hi,

I also cant do this on my shop. Can you send me a step by step. This coding is very complicated for someone not tech savy.

I would also like to change the colour of the 50% off showing, how to do that?

 

0 Likes