Thanks in advance!
I am looking to hide all of my collection images except for the first two images only for mobile on the home page. Example shown below.
How my site looks:
How I would like my site to look:
Topic summary
A user wants to hide collection images on their homepage for mobile devices, keeping only the first two visible in the Dawn theme.
Current Issue:
- Multiple collection images display on mobile homepage
- User wants to limit display to first two images only
- Desktop view should remain unchanged
Proposed Solution:
A PageFly representative provided CSS code to be added to the theme.liquid file:
- Navigate to: Online Stores > Themes > More Actions > Edit code
- Locate theme.liquid file
- Insert the provided CSS code above the
</head>tag
Note: The actual CSS code content appears corrupted or improperly formatted in the conversation, making the specific implementation details unclear. The solution involves custom CSS targeting mobile viewports to selectively hide collection images beyond the first two.
Hi @MMast
This is Richard from PageFly - Shopify Page Builder App
Please add this code to your theme.liquid above the to get this solved
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on theme.liquid and paste the code above the
Hope this can help you solve the issue
Best regards,
Richard | PageFly
1 Like