Modify placement of old / new price?

Topic summary

A user wants to reposition the sale price and original price display on their product pages, currently showing in a standard format. They prefer Amazon’s layout with the original price positioned below the sale price, and would like to add an automatic percentage discount calculation.

Current vs. Desired Layout:

  • Current: Standard horizontal arrangement of old/new prices
  • Goal: Amazon-style vertical stacking with original price below, plus percentage savings

Solution Provided:
A community member offered CSS code to be added to the theme.liquid file (above the </body> tag). The solution appears to address the repositioning request, with a result screenshot showing the modified layout.

Status: The technical solution has been shared but not yet confirmed as implemented or tested by the original poster.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.

Generic placement: old price & new price

Nuevra_0-1742458618346.png

I would like to reverse it or if possible ideally I want to copy this Amazon format. If possible just setting old price below the main price line. And potential ability to automatically show a percentage difference. Thank you! :grin:

1 Like

Hey @Nuevra

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

Thanks for the welcome and trying to help, here it is: PURSEGLOW 2.0 – Nuevra

1 Like

Hey @Nuevra

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag


RESULT:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like