Dawn theme - mobile preview on editor on laptop is different from what I actually see on mobile

Shopify Discussion

Topic summary

A user customized the Dawn theme to hide product titles and prices in collection pages on desktop, which worked correctly. However, a discrepancy emerged between the mobile preview in the theme editor (showing titles/prices hidden as intended) and the actual mobile display (still showing titles/prices).

Resolution:

  • Another user provided a solution involving adding custom CSS code to the theme.liquid file, placed above the </body> tag
  • The fix successfully removed titles and prices on mobile devices

Follow-up Issue:

  • After implementing the solution, excessive spacing appeared between product images
  • The original poster requested help reducing this spacing to match the lateral padding
Summarized with AI on November 17. AI used: claude-sonnet-4-5-20250929.
1

I am using Dawn theme and I want to remove items titles and prices from collections and featured collections on both desktop and mobile.
I managed to do this on desktop, I added some bits of codes, and now titles and prices don’t show on collections when I open the website on my laptop (1st screenshot).

The mobile preview on the editor on my laptop looks fine, titles and prices are not there (2nd screenshot)

But when I actually open the website from my mobile, titles and prices are still below the images in the collections and featured collections (3rd and 4th screenshots).

I am in the initial trial.

Below the screenshots that illustrate the issue and the link to the website, the password is Chonga:

https://77af35.myshopify.com/

Screenshot (1421).png
Screenshot (1421).png1920×1080 365 KB

Screenshot (1423).png
Screenshot (1423).png1920×1080 252 KB

WhatsApp Image 2023-09-03 at 13.10.43.jpg
WhatsApp Image 2023-09-03 at 13.10.43.jpg945×2048 149 KB

Screenshot_20230903-132202_Chrome.jpg
Screenshot_20230903-132202_Chrome.jpg1080×2340 144 KB

2

Hey @Andrecolap

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-1693745975040.png
Moeed_0-1693745975040.png388×694 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
3

Thank you Mood, it worked!

Just now I have a bit too much space between the images, how do I reduce it?

It would be great if it was like the lateral padding.

Thank you very much!