How can I display both the original price and the discounted price on a product?
Topic summary
Core Question:
How to show both original and sale prices on product pages in Shopify.
Primary Solution (Accepted):
- Use the “Compare at price” field in product settings
- Enter discounted price in “Price” field
- Enter original price in “Compare at price” field
- This displays the original price crossed out alongside the discounted price
- Can also be implemented via theme code using
{{ product.compare_at_price }}and{{ product.price }}in product-template.liquid
Important Limitation:
- Discount codes don’t update visible prices on product pages—they only apply at checkout
- The compare_at_price method requires manual updates per product
- For storewide sales or large catalogs, manual updates become impractical
Alternative Approach:
- Third-party apps (like Adsgun) can dynamically apply and display discounts across the entire site without manual price updates or code modifications
- Useful for automated discount visibility on homepage, product pages, and cart
Status: Resolved for basic compare-at-price implementation; ongoing challenge for dynamic discount code display.
Hi @RevivalBrand 
this would be an advanced theme customization that would have to use static business logic for the discount-price.
basically discounts are not calculated until AFTER an item is put into the cart so preemptive pricing data is not available.
So any discount logic has to be predefined separately such as in a tag, metafield, or metaobject to show the price to be expected in the cart/checkout.
If you need this customization then contact me for services or consultation.
Contact info in forum signature.
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.
1 Like
Hi there - I actually think this is possible (at least on the product page itself)
To display both the original price and the discounted price on a product in Shopify, use the “Compare at price” field in the product settings. Here’s how:
- Go to your Shopify admin and select “Products.”
- Choose the product you want to edit.
- In the Pricing section, enter the discounted price in the “Price” field.
- Enter the original price in the “Compare at price” field. This will show the original price crossed out alongside the discounted price on your product page.
2 Likes
Hey RevivalBrand,
Heddy from Gameball: Loyalty Program & VIP here!
To display both the original price and the discounted price on your Shopify product page, you’ll need to modify your theme code slightly. Here’s what you can do:
- Go to Online Store > Themes > Actions > Edit Code.
- In your product-template.liquid file (or a similar file), locate where the product price is displayed.
- Add {{ product.compare_at_price }} to display the original price alongside {{ product.price }} for the discounted price.
1 Like
Hi @RevivalBrand ,
See the below attachment for adding display both the original price and the discounted price on a product.
Thanks!
2 Likes
This is the answer I needed thank you!
The Answer I needed thank you
If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!
Heads up for anyone using discount codes (instead of manually setting compare_at_price) — the accepted answer won’t fully solve it.
Shopify doesn’t visually update the price when a discount code is used — it only applies at checkout. So even if a product is discounted, the original price still shows on the product page unless you hardcode the pricing.
If you’re running storewide sales or have hundreds of products, manually updating compare_at_price is a nightmare.
We’ve used a tool called Adsgun (https://apps.shopify.com/adsgun) that auto-applies discounts and updates visible prices dynamically across the site — homepage, product, cart, everywhere — without editing each product or messing with liquid.
Really helpful if you want the actual discount to show without rewriting everything.