Solved

Black lines appearing on product thumbnails

heftyfabworks
Tourist
11 0 8

Hello,

I've been working to make our product photo sizes consistant (not have black borders) so I've been resizing them to 2048 x 2048 and adding white edges as needed. For some reason, some of them end up getting thin black lines around one side of the image. It doesn't happen to all of them but I've tried resizing, saving png vs jpeg etc and it still seems to happen. Is there something I can do to fix this? I've included a photo example.

 

Thanks

 

black lines.png

Accepted Solution (1)
KetanKumar
Shopify Partner
36854 3637 11976

This is an accepted solution.

@heftyfabworks 

Thanks for more details 

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

.grid__image-ratio {background-color: transparent;}

 

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

View solution in original post

Replies 8 (8)

KetanKumar
Shopify Partner
36854 3637 11976

@heftyfabworks 

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
heftyfabworks
Tourist
11 0 8

Our website is https://heftyfab.com/ 

 

Thank you for your help.

KetanKumar
Shopify Partner
36854 3637 11976

@heftyfabworks 

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

also give particular page link if you have issue 

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
heftyfabworks
Tourist
11 0 8

I'm currently using Chrome. If I use my mobile device, Iphone, and the lines don't appear.

Example page: https://heftyfab.com/collections/recovery

Starting to wonder if it's just a browser issue.

KetanKumar
Shopify Partner
36854 3637 11976

This is an accepted solution.

@heftyfabworks 

Thanks for more details 

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

.grid__image-ratio {background-color: transparent;}

 

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
heftyfabworks
Tourist
11 0 8

Holy cow thank you so much! It looks like it fixed it AND you saved me a ton of work having to go through and edit out the dead space in the photos and make them all white. Thank you!

KetanKumar
Shopify Partner
36854 3637 11976

@heftyfabworks 

Thanks for your feedback and support.

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

KSabra
Tourist
4 0 2

I have the same issue. The photos I'm adding to my stores pages (not theme, not products) is placing a line on the left side. There is no such line in the uploaded photo. How can I fix this?

 

 

KSabra_0-1715287753011.png