Shopify themes, liquid, logos, and UX
Hi, I have just switched to the dawn theme, however the images on the product pages are absolutely huge. Is there any way to resize them? Thanks
Solved! Go to the solution
This is an accepted solution.
I don't know why people always ask for your link first
It's easy my friend
Video:
How to make your product images smaller in Shopify 2.0 Dawn theme
Firstly you can identify the problem:
The product image is too large
In this example you want to look for product__media in section-main-product.css
Then you simply want to change the .product:not(.product — no-media) .product__media-wrapper {
max-width: 64%;
width: calc(64% — 1rem / 2);
}
Change the percentage to whatever you want and you’re done
Hi @Natalie_Z Dawn is having this src-set which images are being called depending on the screen size. If you want to adjust it. You have to adjust the src-set
Well done!
Thanks income stream surfers!
Okay since I'm not a computer wiz, can a person just go to the section-main and change the size and that will take care of the entire store, or does a person have to go to the inspect on each product page and do something first? What about an image on the front page of the store, if they want it smaller? Will going to the section-main and then change the size in there take care of all pictures? Just trying to figure this out as the pics are to big and slowing my store down. Thanks in advance for helping me because I'm not quite understanding everything on the video. It went to the inspect on the page and then it went to the section-main, so I'm not sure if a person needs to do both to make it work.
Marilyn
@HamishDavisonIC Do you know how to also change the size of the thumbnail images? I would like four thumbnail images to fit underneath the main image.
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
Hi,
How can I do to see all the images in the mobile phone? I want that all of them appears under the main photo. Do you know how to do it? thanks!
Thanks it works fine, but is there any way to expand the size of the product info?
https://www.amamoslasflores.com.mx/products/bouquet-amor-en-rosa-rosas-y-hortencias
It looks bad after resizing
Thanks
can you please select medium size i hope this fine
Having the same issue with no good answer as yet .
1. Resizing the image and adding a carousel display like . Similar to debut theme
2. Splitting the description text to occupy the full width.
User | RANK |
---|---|
163 | |
146 | |
71 | |
67 | |
55 |
Explore the 30-30-30 rule, a dynamic social media strategy for new businesses. Learn how t...
By Trevor Sep 20, 2023Discover how to leverage the often overlooked footer of your ecommerce site to gain custom...
By Skye Sep 15, 2023In this blog, we’ll be shining a light on Shopify Partners, Experts, and Affiliates. Who a...
By Imogen Sep 13, 2023