Modular theme make product image smaller

Solved
Highlighted
Excursionist
13 0 3

Hi,

I am using modular theme and would like my product images smaller.

Can anyone please advise on how to do this?

www.heppells.co.uk

0 Likes
Highlighted

Hello @Heppells 

Add this css at the bottom of

Online Store->Theme->Edit code->Assets->theme.scss.liquid

.container-wrap {
	padding: 0 15px;
}

Hope this will work for you.
Thanks!

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Excursionist
13 0 3

Hi @oscprofessional 

thanks for your reply, but this did not do anything to my product images on my product pages.

Do you have any other suggestions?

Thanks again

0 Likes
Highlighted

This is an accepted solution.

@Heppells,

Please add below css

@media screen and (min-width: 550px) {
#shopify-section-product-template .product-layout-images--small .productImgSlider {
    width: 100%;
}
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
1 Like
Highlighted
Excursionist
13 0 3

perfect thank you

0 Likes
Highlighted
Shopify Partner
5956 873 2007

This is an accepted solution.

@Heppells 

Thanks for the update.
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media screen and (min-width: 550px) {
.product-layout-images--small .productImgSlider {
    width: 50%;
margin: 0px auto;
}
}

 

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like