Display Text Only When The Item Is On Sale

Store Design
, , ,
1

Hello

I would like to know if it is possible to display a message only when an item is on sale, let me explain:

I would like there to be this message “↑PRIX NEUF‎ ‎ ‎ ‎ ↑PRIX PROPOSÉ PAR JADIS” as in the photo below but only if the product is on promotion

Same for the ⓘ pop up please

JADIS_0-1677693896753.png
JADIS_0-1677693896753.png998×417 230 KB

My website : jadis-shop.com

Password : rj

Using Dawn Theme

Thanks in advance

2

You would need to edit the dawn theme file: main-product.liquid and add the following code where you would like “Sale Badge” to show up.

{% if product.compare_at_price > product.price %}
This product is on sale!
{% endif %}

Reference: https://shopify.dev/docs/api/liquid/tags/conditional-tags

3

No, you didn’t understand what i want i think man, I would like there to be this message “↑PRIX NEUF‎ ‎ ‎ ‎ ↑PRIX PROPOSÉ PAR JADIS” as on the photo but only if the product is on promotion

4

Hi @JADIS ,

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/section-main-product.css->paste below code at the bottom of the file:

.product__info-wrapper .price:not(.price--on-sale) {
    position: relative;
}
.product__info-wrapper .price:not(.price--on-sale):after {
    content: "";
    position: absolute;
    height: 40px;
    width: 100%;
    left: -2px;
    top: 100%;
    background: #fff;
}

PageFlyRichard_0-1677773444915.png
PageFlyRichard_0-1677773444915.png1282×711 301 KB

I hope it would help you
Best regards,

Richard | PageFly

5

Hello again, I’m glad to see that you answered me.

My website is: jadis-shop.com

password: rj

I explain the situation to you, I see that you have managed to solve my problem (remove the message when the product is not on promotion)

I would like to know if you could add code so in addition to that, when a product is not on promotion, remove the pop up ⓘ (only this one). This pop up is located where there is the red circle under the photo below.

JADIS_0-1677834802225.png
JADIS_0-1677834802225.png999×607 309 KB

Thanks in advance

6

Hi @JADIS ,

Sure, I’m happy to help you. Let’s try this solution:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Sections->/main-product.liquid->paste below code at the TOP of the file:

{% unless product.compare_at_price > product.price %}

{% endunless  %}

I hope it would help you
Best regards,

Richard | PageFly

7

Hello again, you solution don’t work unfortunately, can you help me please man ? :heart:

8

Hi @JADIS ,

I checked, it seems to work using my code

PageFlyRichard_0-1678280748296.png
PageFlyRichard_0-1678280748296.png1880×927 200 KB

Do you need any more help?

Best regards,

Richard | PageFly