All things Shopify and commerce
Good day!
How to edit the Sale word on the product page to percentage?
https://scholl-shoes.com.ph/collections/sale-product-may-29-2024/products/evis-2-0-womens-casual-san...
Thank you!
Solved! Go to the solution
This is an accepted solution.
@smsigroup Just remove the red box code (see screenshot) and replace the code with the below code
{% if product.compare_at_price_max > product.price %}
{% assign discount_percentage = product.price | times: 100.0 | divided_by: product.compare_at_price_max | minus: 100.0 | abs %}
<span class="product-tag gradient-theme">
{{ discount_percentage | floor }}%
</span>
{% endif %}
save and check it will resolve your all issues and let me know if works!
@smsigroup You have to add the code in the product template file, find the sale tag code and place the below code
{% if product.compare_at_price_max > product.price %}
{% assign discount_percentage = product.price | times: 100.0 | divided_by: product.compare_at_price_max | minus: 100.0 | abs %}
<p>Your save tag code or text {{ discount_percentage | floor }}%</p>
{% endif %}
that's it now instead of sale badge it will show the percentage of save!
@saim007
Thank you for the reply.
Theme settings setup;
Tag Sale Product: %
in the product list view it shown the percentage of the discount, but in the product view it shown the Sale word instead of the percentage discount.
Product list view;
Product view;
- after i paste the code.
- it should change the SALE to -30%
Thank you!
@smsigroup You have to find out the correct product template then apply my code then it will show % instead of Sale word in product view layout.
@saim007
i already found the correct product template, and paste the code
<div class="col-12 col-md-6 order-1" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<div class="product-single__info-wrapper">
<meta itemprop="priceCurrency" content="{{ shop.currency }}">
<link itemprop="availability" href="http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}">
<div class="product-single__meta small--text-center">
<h1 itemprop="name" class="product-single__title">{{ product.title }}<sup><span id="ProductSaleTag-{{ section.id }}" class="{% unless product.compare_at_price > product.price %}hide{% endunless %}">
{% if product.compare_at_price_max > product.price %}
{% assign discount_percentage = product.price | times: 100.0 | divided_by: product.compare_at_price_max | minus: 100.0 | abs %}
<p>Your save tag code or text {{ discount_percentage | floor }}%</p>
{% endif %}
<span class="product-tag gradient-theme">
{{ 'products.product.on_sale' | t }}
</span>
</span></sup>
this is the result
This is an accepted solution.
@smsigroup Just remove the red box code (see screenshot) and replace the code with the below code
{% if product.compare_at_price_max > product.price %}
{% assign discount_percentage = product.price | times: 100.0 | divided_by: product.compare_at_price_max | minus: 100.0 | abs %}
<span class="product-tag gradient-theme">
{{ discount_percentage | floor }}%
</span>
{% endif %}
save and check it will resolve your all issues and let me know if works!
Hello @smsigroup
It usually requires editing your theme's code to change the "Sale" word on the product page to show a percentage Usually, this is in a file called product.liquid or product-template.liquid. You must edit the code to change the phrase "Sale" to the percentage discount when you've found the appropriate one.
Hi @smsigroup
1. From your Admin page, go to Online Store > Themes > Click the three dots > Edit default theme content
2. Under the Search bar, type Sale
3. Look for the work Sale inside the textbox
4. Change the word and SAVE
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024