Solved

Product image on mobile is too small

jupiterrx
New Member
9 0 0

Hello, we are currently using DAWN. The product images on mobile devices are way too small. It seems that the image is restrained too much on product pages.  The screenshot on the left is how our current product page looks like. However, we would really like to make it look more like the example on the right.

 

Just wondering if anyone could help. Thanks so much.

 

20231201230352.jpg     _20231201230351.jpg

Accepted Solution (1)

PageFly-Henry
Astronaut
986 283 230

This is an accepted solution.

Hi @jupiterrx 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

 

@media (max-width: 767px){

ul#Slider-Gallery-template--19339770003737__main {

    scroll-padding-left: 0 !IMPORTANT;

    width: 394px !IMPORTANT;

}}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 4 (4)

Jack_Khan_Baba
Shopify Partner
78 8 14

share your store url also password if it is protected 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
Chat on WhatsApp: +923143054166
Need a Shopify developer? Hire us at naimatullahts335@gmail.com
- Hire me, if you want to design, re-design, develop a store, or make changes to the pre-built store.

StephensWorld
Shopify Expert
1331 155 325

Your best bet is switching to a different theme, if you don't like the way your products look on mobile, using the Dawn theme.

★ Did my post help? If yes, then please like and accept solution. ★

https://stephens.world
support@stephensworld.ca

PageFly-Henry
Astronaut
986 283 230

This is an accepted solution.

Hi @jupiterrx 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

 

@media (max-width: 767px){

ul#Slider-Gallery-template--19339770003737__main {

    scroll-padding-left: 0 !IMPORTANT;

    width: 394px !IMPORTANT;

}}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

jupiterrx
New Member
9 0 0

That works. Thank you so much!