How to display the sale price first and the strike-through price (original price) afterward?

[ROEDADK]

Hey there,

How to display the sale price first and the strike-through price (original price) afterward on Shopify product page, my theme is dawn.

Link to the page: Ayatul-Kursi Bracelet Cuff – ClassyCuff

screenshot for context:

[Vinsinfo]

Please follow below steps to display sale price first and strike through price after. Let me know whether it is useful for you.

1. From admin, go to “Online Store” → “Themes”.
2. Click action button from the current theme and select “Edit code”.
3. Go to “price.liquid” and search "{{ ‘products.product.price.sale_price’ | t }} ". Select this code and below code as shown in below “Before” screenshot and paste the codes above next to the line “
   ” as shown in “After” screenshot.
   Before:

After:

4. Save the file.

Now, the sale price will appear first and strike through price will appear next.

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.

[Vinsinfo]

@ROEDADK

Please follow below steps to display sale price first and strike through price after. Let me know whether it is useful for you.

1. From admin, go to “Online Store” → “Themes”.
2. Click action button from the current theme and select “Edit code”.
3. Go to “price.liquid” and search "{{ ‘products.product.price.sale_price’ | t }} ". Select this code and below code as shown in below “Before” screenshot and paste the codes above next to the line “
   ” as shown in “After” screenshot.
   Before:

After:

4. Save the file.

Now, the sale price will appear first and strike through price will appear next.

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.

[devcoders]

Hi @ROEDADK

Admin, go to online store > themes > actions > edit code.
Asset > base.css and paste this at the bottom of the file.

.price--on-sale .price__sale {
    display: flex;
    align-items: baseline;
}
.price--on-sale .price__sale span {
    order: 2;
}
span.price-item.price-item--sale.price-item--last {
    order: 0;
}

[Vinsinfo]

@ROEDADK Please follow below steps to display sale price first and strike through price after. Let me know whether it is useful for you.

1. From admin, go to “Online Store” → “Themes”.

2. Click action button from the current theme and select “Edit code”.

3. Go to “price.liquid” and search "{{ ‘products.product.price.sale_price’ | t }} ". Select this code and below code as shown in below “Before” screenshot and paste the codes above next to the line “

   ” as shown in “After” screenshot.

Before:

After:

4. Save the file.

Now, the sale price will appear first and strike through price will appear next.

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.

[ROEDADK]

Hi there, I tried it but it didnt work

[devcoders]

Hi @ROEDADK

Admin, go to online store > themes > actions > edit code.
Asset > base.css and paste this at the bottom of the file.

.price--on-sale .price__sale {
    display: flex!important;
    align-items: baseline;
}
.price--on-sale .price__sale span {
    order: 2;
}
span.price-item.price-item--sale.price-item--last {
    order: 0;
}

[luvfundersts]

Hello, I made code changes. What to do after that? Where should I edit my pricing to reflect changes on my store