Hi. Does anyone know how to make the grind from 2 photos on row, to only one photo on row? I’m using Dawn Theme
Topic summary
A user sought to modify the Dawn theme’s product photo grid from displaying two photos per row to just one photo per row.
Initial Suggestions:
- One respondent provided instructions for adjusting product media settings through the theme customizer (Products template > Default Product Template > Product Info settings), but this didn’t address the specific layout request.
- The user clarified with a visual example showing the desired single-column product grid layout.
Solution:
- Another community member provided a CSS code snippet to add to the theme’s custom.css or theme.css file:
.product__media-item {
width: 100% !important;
max-width: 100% !important;
}
Outcome:
- The CSS solution successfully resolved the issue, achieving the single-photo-per-row layout the user wanted.
Good Day! Welcome to the Shopify Community. Please follow the instructions below to change the product media settings:
Online Store > Themes > Customize >
Select PRODUCTS template from the dropdown on the top middle of the theme editor page > Select Default Product Template > Click on “Product Information” under Template > Now you change the settings of the Product Media Settings according to your store needs.
Hi. Thank you for your reply but unfortunately, I don’t have the specific option I asked for. Here is an example to understand what I was referring to:
That is the layout I want, but unfortunately, I don’t have the option for it.
Hello @AndreiGhetu ,
It’s the GemPages Support Team and we are glad to assist you today!
Could you please share your store URL ( with the password if your store password is enabled ) then I can see and suggest something for you?
Best regards,
GemPages Support Team
Hi @AndreiGhetu ,
Online Store > Themes > Edit code > Assets > custom.css or theme.css
.product__media-item { width: 100% !important; max-width: 100% !important;}
It worked! thank you!