Product images

Solved
luxorypets
Excursionist
17 0 7

Hi Shopify community.

I have been looking here for an answer for a problem that I have:

 

The product images which are being imported automatically in the shop (dropshipping) are all with a different size.

I would like t have them all the same size and if possible with a border around it like this:

luxorypets_0-1610213825780.png

 

Is there any possibility to make this? I am using the Shopify Minimal theme.

KetanKumar
Shopify Partner
20651 2142 7822

@luxorypets 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

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 Partner | 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
luxorypets
Excursionist
17 0 7

Sorry, forgot the url:

Luxory-pets.myshopify.com

(Www.luxorypets.nl)

 

0 Likes
KetanKumar
Shopify Partner
20651 2142 7822

@luxorypets 

is this a fine look?

KetanKumar_0-1610218237586.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 Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
luxorypets
Excursionist
17 0 7

This looks good, is there any possibility to ad border around it? And will this also be automatically done by images (products) that will be imported?

Thanks for your time and will to help by the way

KetanKumar
Shopify Partner
20651 2142 7822

@luxorypets 

Thanks for confirm

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

.grid-link__image {height: auto !important;}
.product__img-wrapper div {padding-top: 100% !important;}
.product__img-wrapper.supports-js .product__img {
    object-fit: contain;
    max-width: 100% !important;
    max-height: 100% !important;
}
.product__img-wrapper div.giraffly_Quickbuy_Round {
    padding: 0 !important;
}

 

 

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 Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
luxorypets
Excursionist
17 0 7

I just apply the code and it worked, all the product images are the same size now!! Thank you very much for this.

Is there also any chance to ad a border around it?

 

KetanKumar
Shopify Partner
20651 2142 7822

@luxorypets 

Yes, if you have add border look like this 

KetanKumar_0-1610225156465.png

 

some product name long so doesn't proper alignment if this fine 

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 Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
luxorypets
Excursionist
17 0 7

This is exactly what I was lookin for all the time, but they are not the same size?

KetanKumar
Shopify Partner
20651 2142 7822

This is an accepted solution.

@luxorypets 

It can be done by doing some code customization. please send me a personal message and we can discuss what you'd like

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 Partner | 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