Solved

First photo in product page are mush smaller tan other photos

GavinZ
Tourist
9 0 1

Our product photo for each product are wearied, the first photo for every single product are much smaller than the rest of the photos, the size of the rest of the photos are correct, only the first one are small. what should I do?

product1.png

product2.png

  

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
6915 1305 1333

This is an accepted solution.

Please update code to this 

<style>
.productView-image.fit-unset .productView-img-container .media img {
    aspect-ratio: 3 / 2;
    width: 100% !important;
}
</style>

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 11 (11)

Dan-From-Ryviu
Shopify Partner
6915 1305 1333

Hi @GavinZ 

Could you share your store URL to check?

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

GavinZ
Tourist
9 0 1
Dan-From-Ryviu
Shopify Partner
6915 1305 1333

Hi, please add this code to your theme.liquid file, after <head> element in Online Store > Themes > Edit code to solve the issue 

<style>
.productView-image.fit-unset .productView-img-container .media img {
    aspect-ratio: 1;
    width: 100% !important;
}

</style>

 

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

GavinZ
Tourist
9 0 1

Dear Dan,

 

I did add your code in theme,  but now all photos are changed to square, and proportion are changed also. What should I do?

photo3.png

Dan-From-Ryviu
Shopify Partner
6915 1305 1333

This is an accepted solution.

Please update code to this 

<style>
.productView-image.fit-unset .productView-img-container .media img {
    aspect-ratio: 3 / 2;
    width: 100% !important;
}
</style>

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

GavinZ
Tourist
9 0 1

It's Fixed!!! Thank you so much for your help! It confused me for such a long time!

Dan-From-Ryviu
Shopify Partner
6915 1305 1333

Happy I could help 😊

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

GavinZ
Tourist
9 0 1

One more question! It seems like a little bit of photo quality lag than before, is there anything can fix that? Or stay like now will be fine tho.

Dan-From-Ryviu
Shopify Partner
6915 1305 1333

Please try to update the code to this and check again 

<style>
.productView-image:first-child .productView-img-container .media img {
    aspect-ratio: 3 / 2;
    width: 100% !important;
}
</style>

 

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

GavinZ
Tourist
9 0 1

Thank you so much! It's perfectly fixed!

Dan-From-Ryviu
Shopify Partner
6915 1305 1333

Very welcome.

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now