How To Make Product Images Bigger On Product Page (Mobile)

Solved

How To Make Product Images Bigger On Product Page (Mobile)

MMast
Trailblazer
182 1 25

Thanks in advance!

I am looking to make the product images a bit bigger on the product page (mobile). Example shown below.

Screenshot 2024-06-26 084421.png

https://decemberschild.com/

password: dc

Accepted Solutions (2)

BSS-TekLabs
Shopify Partner
535 153 177

This is an accepted solution.

- Here is the solution for you @MMast 
- Please follow these steps:

step.png

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.product-media-container .product__media img {
     transform: scale(1.1) !important;
}

- Here is the result you will achieve:

BSSTekLabs_0-1719407072284.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

MMast
Trailblazer
182 1 25

This is an accepted solution.

For anyone wondering, you can't have two 'transform' code's in the same folder (theme.liquid) or it will move your product image around on your mobile site.

View solution in original post

Replies 2 (2)

BSS-TekLabs
Shopify Partner
535 153 177

This is an accepted solution.

- Here is the solution for you @MMast 
- Please follow these steps:

step.png

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.product-media-container .product__media img {
     transform: scale(1.1) !important;
}

- Here is the result you will achieve:

BSSTekLabs_0-1719407072284.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency
MMast
Trailblazer
182 1 25

This is an accepted solution.

For anyone wondering, you can't have two 'transform' code's in the same folder (theme.liquid) or it will move your product image around on your mobile site.