When I apply this code it achieves the vertical goal but unfortunately alters the photo aspect ratio and sizing so that they no longer display in exactly the same sizing both on desktop and mobile. You may not have noticed this if your photos were all the same size in the first place. Is that something you could correct? Thanks very much!
Topic summary
A user wants blog posts to stack vertically on mobile instead of sliding horizontally in the Dawn theme.
A solution is provided involving editing the featured-blog.liquid file in the theme code editor. The fix includes replacing the entire file content with modified code that changes mobile layout while preserving desktop appearance.
Key implementation details:
- Navigate to: Online Store > Theme > Edit Code >
featured-blog.liquid - Replace entire file with provided code snippet
- Desktop view remains unchanged; only mobile layout is affected
Reported issues:
- Image aspect ratios and sizing become inconsistent after applying the code, particularly noticeable when original photos vary in size
- Pagination scroll persists and “View All” button doesn’t appear on mobile
Partial workaround identified:
Adjusting the padding value in the CSS portion of the code (changing from 15px to 5px) helps restore normal aspect ratios:
.article-card-wrapper.card-wrapper {
padding: 5px;
}
The aspect ratio issue remains unresolved for users with varying image sizes.