How can I adjust the sales badge style in Dawn Theme?

Store Design
, , ,

Topic summary

Mobile badge styling in Dawn theme: the sale badge sat slightly below the product image and its text overflowed on mobile; the requester wanted it flush at the top of the image and to allow two lines.

Resolution: a helper provided custom code to add in theme.liquid (above ), which repositioned and styled the badge as desired. The requester confirmed it worked; a screenshot illustrated the result.

Follow‑ups:

  • Text change request: from “Ersparnis zum Markenduft 85,00€” to “Spare 85,00€”. Guidance was to use Online Store > (three dots) Edit default content to locate and edit the relevant string.
  • Additional styling: another participant proposed CSS that accommodates both a sale badge and a “sold out” badge and adjusts spacing (code details not shown here).

Open item: the requester asked if it’s possible to add a second line under the product title (per‑product, to insert different details). No solution provided yet.

Status: initial mobile badge positioning/line-break issue resolved; text localization and multi‑badge considerations noted; new request for a second per‑product line remains unanswered.

Summarized with AI on December 16. AI used: gpt-5.
1

How can i change the position from the red badge.
I want that the badge is in 2 lines otherwise its not possible to display the whole text. And it should be directly on top of the product picture not 2mm under it.

Anyone advice ?

IMG_0980.png
IMG_0980.png1284×2778 296 KB

2

do you have the preview link?

3

https://www.senttense.com/collections/frauendufte-auto-parfum But its only in the Mobile Design the Problem

1 Like
4

Hey @senttense

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1729700746206.png
Moeed_0-1729700746206.png373×663 119 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
5

Thank you it works. :slightly_smiling_face:

6

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

7

Can you tell me how can i change the Text from

Ersparnis zum Markenduft 85,00€ to

Spare 85,00€

8

Try searching for it in Edit Default Content by clicking on the 3 dots when you click on Online Store.

Best Regards,

Moeed

1 Like
9

I recommend following as it considers both a sale badge and another badge like ‘sold out’ and also some style for the space you mentioned.
10

Hello Mate :slightly_smiling_face:

Do you know if its possible to make a second line there. Like a second product title that i can insert different details for each product ?

Thanks a lot !

Bildschirmfoto 2024-10-24 um 18.06.13.png
Bildschirmfoto 2024-10-24 um 18.06.13.png1884×512 196 KB