Hey,
(desktop only)
I’d line to decrease the margins of my product pictures and instead of them being in a grid, just go straight down through scrolling (like example). How do I achieve this?
Let me know if more info is needed!
Thanks,
Topic summary
A Shopify store owner wants to modify their product page layout on desktop by:
- Making product images display vertically in a single column instead of a grid
- Removing white margins/borders between and around the images
The user provided their store URL (sonissonofficial.com) and reference images showing the current grid layout.
Solution provided:
A community member shared CSS code to be added to the theme.liquid file (before the </body> tag). This successfully achieved the vertical stacking of images.
Current status:
Partially resolved. The vertical layout now works, but the original poster still needs help removing the white borders/spacing between images and on the sides. They’ve requested additional guidance for this remaining issue.
1 Like
Try this one .
- From your Shopify admin dashboard, click on “Online Store” and then “Themes”
- Find the theme that you want to edit and click on “Actions” and then “Edit code”.
- In the “theme. Liquid” file. Find the tag and paste the code below before the tag.
- And Save.
- Result:
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
1 Like
@Made4uo-Ribe Thanks!!
That worked for the “stacked pictures” part, but im still wondering how to remove these white borders in between pictures and on the side, any chance you know how to help with that as well?
TYSM!
