Debut theme - Change product image size (desktop only)

Solved
jdreyer
Tourist
11 0 5

Hello, 

I would like to increase my product image size to be more like the ratio in the image below: (except my site has 4 images per row - for desktop format only please)

Screen Shot 2021-01-15 at 12.48.23 am.png

My website is finley-fergus.myshopify.com and here is an example of what mine is now on desktop:

Screen Shot 2021-01-15 at 12.50.04 am.png

Could the product labels and prices also please be centred (both desktop and mobile please).

AND! Could I also ask for help coding the hover effect where the second product image is shown when the customer hovers? 

Thank you very much!

KetanKumar
Shopify Partner
14570 1676 5229

@jdreyer 

Thanks for post 

thanks for all details 

sorry  your store is password 

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
0 Likes
jdreyer
Tourist
11 0 5

@KetanKumar it is aidrao - thank you

0 Likes
KetanKumar
Shopify Partner
14570 1676 5229

@jdreyer 

sorry

KetanKumar_0-1610699193796.png

 

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
0 Likes
jdreyer
Tourist
11 0 5

Sorry it is  finley-fergus.myshopify.com - I think you missed the first 'f' in the url

0 Likes
KetanKumar
Shopify Partner
14570 1676 5229

@jdreyer 

Thanks for but your store is password protect.

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
0 Likes
jdreyer
Tourist
11 0 5

@KetanKumar the password is aidrao - thank you

0 Likes
KetanKumar
Shopify Partner
14570 1676 5229

@jdreyer 

is this fine for you?

KetanKumar_0-1611060519052.png

 

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
jdreyer
Tourist
11 0 5

That size is perfect thank you!

KetanKumar
Shopify Partner
14570 1676 5229

This is an accepted solution.

@jdreyer 

Thanks or confirm
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
This code applies after 5-6 second

.grid-view-item__image-wrapper {max-width: 100% !important;}
.grid-view-item__image-wrapper .grid-view-item__image {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain;
}

 

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