@INKLY if you’re comfortable editing your theme code, you can customize the product price section to calculate and display the percentage off next to the original price—but it does take some Liquid and math logic. Another option is to use an app if you’d rather not deal with code.
For example, Klip Coupons: Sales and Discounts adds a clippable coupon directly on the product page, and when a customer clips it, it can show the discounted price and highlight how much they’re saving (percentage or fixed). It’s a clean way to draw attention to the offer without modifying your theme.
Useful if you’re trying to drive more conversions visually without hardcoding every price change
On the Collections Page, the Discount is appearing on the picture, I want to be seen near the price not on image. Request your help
Also, the product image shows the word SALE which I dont want.
1 Like
Please find this line contains this code around line 515
{% render 'price'
Add this code below it
{%- if card_product.compare_at_price > card_product.price and card_product.available -%}
{%- assign percent = card_product.compare_at_price | minus:card_product.price | times: 100 | divided_by:card_product.compare_at_price | round -%}
Save {{ percent }}%
{%- endif -%}
hi, I added the code however nothing has changed on the Collections page. here’s the screenshot.
1 Like
Could you share the link to your page so I can check?
Sorry, my mistake. The code must be added below {% render ‘price’ around line 207
have added the code however its coming in the line below, want it next to price as reference and sale written on top left
Please add the following additional CSS to the base.css file to make them appear on one line.
.card--standard>.card__content .card__information .card-information { display: flex; }
.card--standard>.card__content .card__information .card-information .price { margin-right: 8px; }
Where exactly in the base.css file
From Sales channels > Online Store > Themes > click “…” in Current theme > Edit codes
is this correct? because it did not work
