Shopify themes, liquid, logos, and UX
Hi there,
I'd like to change the "sale" badge to "xxx% off". The percentage should be calculated from the price and compared price with the Refresh Theme.
My shop site is: https://roverrats.com/products/small-platform-lava-ledge-for-mice-hamsters-rats-and-more
Thank you so much for any help.
Solved! Go to the solution
This is an accepted solution.
I fixed the issue by changing the code from:
{% comment %}
{{ 'products.product.on_sale' | t }}
{% endcomment %}
{{product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price }}% off
to:
{% comment %}
{{ 'products.product.on_sale' | t }}
{% endcomment %}
{{product.selected_or_first_available_variant.compare_at_price | minus: product.selected_or_first_available_variant.price | times: 100 | divided_by: product.selected_or_first_available_variant.compare_at_price }}% off
1: Online store > themes > Actions > Edit code > Snippets > price.liquid
2: find code ' {{ 'products.product.on_sale' | t }} '
3: replace code
before
{{ 'products.product.on_sale' | t }}
after
{% comment %}
{{ 'products.product.on_sale' | t }}
{% endcomment %}
{{product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price }}% off
Hey,
Thanks for helping out! Though this solves the problem for showing the percentage, the issue is that it doesn't take into account the variations (see GIF below). Do you know how to take into account this? Thank you!
This is an accepted solution.
I fixed the issue by changing the code from:
{% comment %}
{{ 'products.product.on_sale' | t }}
{% endcomment %}
{{product.compare_at_price | minus: product.price | times: 100 | divided_by: product.compare_at_price }}% off
to:
{% comment %}
{{ 'products.product.on_sale' | t }}
{% endcomment %}
{{product.selected_or_first_available_variant.compare_at_price | minus: product.selected_or_first_available_variant.price | times: 100 | divided_by: product.selected_or_first_available_variant.compare_at_price }}% off
How do we reflect this on collections page sales badges as well?
I'm trying to figure out this as well. Any one got an idea?
I also trying to figure out! any answer?
Thank you, it helped
Hi, please do you know how to do the same thing with the dawn them version 9?
Thanks in advance
worked!
I also want to change it on the product grid section on the shop page. How can I do this?
Hi everyone, i need same help.
BR
Raul
Anyone have that answer?
Please go to your Online store > Theme > Edit code > card-product.liquid file, find this line of code:
{{- 'products.product.on_sale' | t -}}
Replace with:
{%- assign percent = card_product.compare_at_price | minus: card_product.price | times: 100 | divided_by: card_product.compare_at_price | round -%}
Save {{ percent }}%
Hey,
i wanted to implement your code but my card-product.liquid file doesnt have a the {{- 'products.product.on_sale' | t -}}. It has it only in price.liquid. Is there another way or do i need the newest version?
Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024