All things Shopify and commerce
Hi Shopify Community,
I would like the products on my collection page to show the percentage and price discount below the compare-to sale price. I followed the instructions in another post but it's not working for me.
I added the below code to Snippets>products-price.liquid at the very end just above </dl> and it's showing only on the product page and not on the collection page.
{% if product.compare_at_price_max > product.price %}You save {{ current_variant.compare_at_price | minus: current_variant.price | times: 100.0 | divided_by: current_variant.compare_at_price | truncate: 5, "" }}%{% endif %}
{% if product.compare_at_price_max > product.price %} ({{ current_variant.compare_at_price | minus: current_variant.price | money }}){% endif %}
I've attached pictures of how it looks like on the product page and where I'd also like it to appear on the collection page. Does anyone know how to fix this issue? Thanks in advance.
Solved! Go to the solution
This is an accepted solution.
Hello There,
1. Go to Online Store->Theme->Edit code
2. Asset->snippets/product-price-listing.liquid->paste bellow code after price
{% if product.compare_at_price_max > product.price %}
You save {{ 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 %}
{% if product.compare_at_price_max > product.price %} ({{ product.compare_at_price | minus: product.price | money }}){% endif %}
This is an accepted solution.
Hello There,
1. Go to Online Store->Theme->Edit code
2. Asset->snippets/product-price-listing.liquid->paste bellow code after price
{% if product.compare_at_price_max > product.price %}
You save {{ 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 %}
{% if product.compare_at_price_max > product.price %} ({{ product.compare_at_price | minus: product.price | money }}){% endif %}
Thank you so much! That worked perfectly.
Where exactly is “ after price”?
Thank you.
What exactly after price means ?
Hello. I really tried to replicate this solution but it wasn't possible to show the discount tags on any collection. Can you specify better where the code must be located, please? I'm using the debut theme.
Hello dear,
I've tried it but there is no effect, would you please show a vidio explanation for the solution? Thanks in advance.
Regards,
Abdulsamad
Do you know hot to make the font italic and change color of 'you save' line?
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024