How can I rearrange price and sale badge positions on my site?

Store Design
1

i want to replace positions between price to compare price,

and move left the sale badge its too close to the price

MYKjewelry_1-1689641733935.png

i hope you understood it, please help!

store url: https://brebojewelry.myshopify.com/

2

Hi @YMKjewelry
You can try follow this path:
Themes => edit code => asset => component-price.css
and add this code to bottom of the file component-price.css

.price--on-sale .price__sale {
direction: ltr;
margin-inline-start: 10px;
}
3

Hello @YMKjewelry ,

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code

Go to Sections → product-template.liquid file

To swap the positions of the compare price and sale price, you’ll need to modify the code that renders the prices. Here’s an example:

{% if product.compare_at_price_max > product.price %}
  {{ product.compare_at_price_max | money }}
  {{ product.price | money }}
{% else %}
  {{ product.price | money }}
{% endif %}

Save and preview

Hope this can help.

Transcy

4

cannot find product-template.liquid file

5

thanks, you helped alot! the badge is fine :slightly_smiling_face: