Changing The Placement Of Sale Price And Regular Price (Dawn Theme)

Retired Boards Appdev Store Design
,

Topic summary

A user wants to swap the display order of sale and regular prices on their Shopify store using the Dawn theme, showing the sale price first instead of second.

Proposed Solution:

  • Locate two specific CSS classes in the product code: "price-item price-item--regular" and "price-item price-item--sale price-item--last"
  • Swap these class names with each other
  • Add CSS code to remove text-decoration from the sale price item in the theme’s CSS file (theme.css/base.css/style.css)

Current Status:
The original poster is unable to locate the required code lines in their theme files despite receiving detailed instructions with screenshots. They’ve requested direct assistance to implement the changes and want to understand exactly what was modified so they can reverse it if needed or handle similar changes independently in the future.

A community helper has offered to implement the solution directly if given store access, suggesting they move the conversation to a private channel (email, WhatsApp, or Shopify DM) to proceed.

Summarized with AI on November 10. AI used: claude-sonnet-4-5-20250929.
1

Hello,

How can i display the sale price first and the regular price second ?

Saw in the discussions it needed to be ask to the “Partners and Developers” Section

Screenshot_1.png
Screenshot_1.png639×155 20.4 KB

Thanks,

Thomas

2

Hi @Thomas942

Can you please provide your store URL and password as well if applicable, so that I can provide you solution that can work for your store.

Best regards

Sahil

3

Of course !

Store url : https://duclens.com

Product page : https://duclens.com/products/kit-nettoyage-toilette

No password :slightly_smiling_face:

Thanks

4

Hi @Thomas942 Thanks for the URL, So to achieve this you need to follow the following steps:

In your theme code, you need to find the product code and then further you need to find these 2 lines of code

“price-item price-item–regular”
“price-item price-item–sale price-item–last”

Now replace “price-item price-item–regular” with “price-item price-item–sale price-item–last” and viceversa.

after that go to theme.css/base.css/style.css file which is available in your theme and this code:

s.price-item.price-item--sale.price-item--last {
    text-decoration: none;
}

If you are not sure where is your theme.css/base.css/index.css/style.css file please follow the steps:

  1. Login in shopify admin.
  2. Click on the Online Store.
  3. Then click on the button next to Customize in live Theme.
  4. Click Edit Code.
  5. Search theme.css/base.css/index.css/style.css in the code in left hand side which ever is available in your theme.
  6. You can add the above code at the bottom of the file.

Result:

sahilsharma9515_0-1712209044878.png
sahilsharma9515_0-1712209044878.png1885×655 130 KB

If you will unable to implement the same then I’m happy to do this for you, let me know. I can implement the code changes so that this will work well for you.

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

Best Regards

Sahil

1 Like
5

Hi @sahilsharma9515 !

Thanks for the reply.

Unfortunately i’m not finding the way to do this first step :

In your theme code, you need to find the product code and then further you need to find these 2 lines of code

“price-item price-item–regular”
“price-item price-item–sale price-item–last”

For me the thing that is close to it is this part :

price.png
price.png1692×1205 141 KB

Like you offered is it possible to do it for me and show me exactly what you changed so i can do it myself next time ?

Futhermore it could help me to undo it if i want too.

Thanks again for the help here,

Thomas

6

Hi @Thomas942 Yes I would love to do it for you, you need to give access of your store so that I can look into the code and implement the code.

Also can we move this conversation from here to whatsapp or email or private message in shopify which ever is suitable for you.

Best Regards

Sahil