Swapping discounted price with old price sense theme

Hello, I am currently working on a store using the Sense Theme.

I am struggling with swapping the discounted price with the original price.

I would like to have the discounted price in front of the old price on the product page of the product itself only! Ill provide an example of how I would like it.

Could someone help me?

Thanks in advance and kind regards :slightly_smiling_face:

Hi @Alllways

Can you please provide your Store URL and Password too?

With Regards,
Dbuglab

https://aliva-amsterdam.nl/

the one with the correct example is: https://novaswinkel.nl/

Hi @Alllways

Please follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Please find theme.liquid file
  4. Add the following code above tag

1 Like

Thank you so much! it worked!

Do you maybe also know how i can make the discounted price larger in comparison to the old price? Just on product page of the product itself


the

Hi @Alllways
use this css

span.price-item.price-item--sale.price-item--last {
    font-size: 29px !important;
    font-weight: bold !important;
}
1 Like

Where do i put this? :slightly_smiling_face:

Hello, it’s quite easy to do in your price.liquid file. You need to reorder code a bit.

Replace :


      {%- unless product.price_varies == false and product.compare_at_price_varies %}
        {{ 'products.product.price.regular_price' | t }}
        
          <s>
            {% if settings.currency_code_enabled %}
              {{ compare_at_price | money_with_currency }}
            {% else %}
              {{ compare_at_price | money }}
            {% endif %}
          </s>
        
      {%- endunless -%}
      {{ 'products.product.price.sale_price' | t }}
      
        {{ money_price }}
      
    

With:


      {{ 'products.product.price.sale_price' | t }}
      
        {{ money_price }}
            
      {%- unless product.price_varies == false and product.compare_at_price_varies %}
        {{ 'products.product.price.regular_price' | t }}
        
          <s>
            {% if settings.currency_code_enabled %}
              {{ compare_at_price | money_with_currency }}
            {% else %}
              {{ compare_at_price | money }}
            {% endif %}
          </s>
        
      {%- endunless -%}
    

It will also be applied to collections pages (product lists) as well. Please mark it as a solution if it helps.

Regards,

Please follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Please find theme.liquid file
  4. Add the following code above tag

in style which you added

1 Like

1 Like

Thank you, only problem is that it changes it also in the collections page. I would prefer it only on the product page of the product itself :slightly_smiling_face:

@Alllways

add this css

.price.price--on-sale .price__sale {
    display: flex!important;
    flex-direction: row-reverse!important;
    align-items: end;
}

1 Like

Thank you!

1 Like