Dawn theme - Sale Price Text corruption

Store Design

Topic summary

Issue: After adding sale apps on a Shopify store using the Dawn theme, price text rendered overlapped/stacked across the site (product pages, checkout, homepage). Screenshots show “Regular price£13.50 Sale price£12.15” compressed and overlaid; images were central to illustrating the problem.

Steps taken:

  • Store URL shared for review.
  • Initial fix: code added in theme.liquid before the tag, which corrected pricing display on product pages (exact snippet not shown in the thread).
  • Remaining issue persisted on collection/home (SALE section, Special Offers collection).

Final fix:

  • Additional CSS added near the end of theme.liquid (before ) targeting collection cards: it disables the generated content and positioning on the price element’s span::after within .custom-collection. This removed the overlay on collection/home pricing.

Outcome:

  • Screenshots confirm correct price display after both changes.
  • Original poster confirmed resolution (“you’re a star!”). No further issues or open questions noted.

Notes:

  • Root cause appears related to theme/app CSS introducing pseudo-element content and positioning in price components, especially in collection tiles.
Summarized with AI on December 20. AI used: gpt-5.
1

I’ve tried a couple of sale apps to add ‘product on sale’ functionality to site running Dawn theme, all seem to create a problem displaying prices.

The text being displayed is overlaid and shown in a compressed/stacked manner. c/p shows what is being displayed by the site is:

Regular price£13.50 Sale price£12.15

Sale

but it displays as:

Screenshot 2024-09-04 at 19.57.27.png
Screenshot 2024-09-04 at 19.57.27.png1690×490 340 KB

It does this whether on the product page, in checkout, on homepage, anywhere there’s prices displaying.

Here’s an example from a category page:

Regular price£13.50 Sale price£12.15

Screenshot 2024-09-04 at 20.03.51.png
Screenshot 2024-09-04 at 20.03.51.png628×858 273 KB

Any suggestions very much welcome.

2

Hey @Netrovert

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

1 Like
3

https://buycarpetonline.uk/

4

Hey @Netrovert

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-1725477630194.png
Moeed_0-1725477630194.png1435×895 241 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

Hi there Moeed,

Thanks so much for sorting that out on our product pages.

The problem still exists on the category pages and the home pages. Could you please take a look at those too?

If you scroll down to the SALE section on the home page or visit here : https://buycarpetonline.uk/collections/special-offers you can see.

Thanks so much so far.

6

Hey @Netrovert

Keep the previous code and add this new code above in the end of the theme.liquid file.

.custom-collection .card-information .price .price__container span::after {
    position: unset !important;
    content: unset !important;
}

RESULT:

Moeed_0-1725478417573.png
Moeed_0-1725478417573.png946×833 493 KB

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

Best Regards,
Moeed

1 Like
7

Thanks Moeed, you’re a star!

8

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.

1 Like