My product thumbnails are small, I tried all the other options in the Dawn theme and they’re not what I want. I’d like for the images in my product page to be bigger or for the text and images to stretch out. I attached an example of how I’d like them to be. Example . Any Idea how to get that done?
Just in case – your example site uses a Tailor theme https://themes.shopify.com/themes/tailor/styles/cotton
So the easiest would be to purchase that theme.
Adding desired layout to Dawn is possible, but not a trivial change.
Hi @RainbowSushi ,
Drop the Store URL,
Same look and feel can be generated,
Thanks for the clarification. How can I do it on the Dawn theme?
Hi, my store is still not published yet, I put a password because I’m still working on it. is there an easy way to get it done?
You can edit code in your theme:
Step 1: Go to Online store => Edit code
Step 2: Find file base.css
Step 3: Add this code bellow at the end of file:
@media screen and (min-width: 990px) {
.product--stacked .product__media-item {
max-width: 100%;
}
}
@media screen and (min-width: 750px) {
.grid--2-col-tablet .grid__item {
width: 100%;
}
}
- This is the result:
I hope these instructions will help you. If they are helpful, don’t forget to like and mark as the solution.
Have a nice day sir!
Hello!
Yes, this is exactly what I want, but I tried to put in the code and it did not work, any idea why? I took a screen shot of where I added the code. Thank you for trying to help!
- First, in theme editor you should setup Desktop layout: Stacked
- Then you should try add !important property in css code:
@media screen and (min-width: 990px) {
.product--stacked .product__media-item {
max-width: 100% !important;
}
}
@media screen and (min-width: 750px) {
.grid--2-col-tablet .grid__item {
width: 100% !important;
}
}
I hope these instructions will help you. Have a nice day sir!