Image not resizing properly on Debut theme/coming up blurry and cropped when uploading image

New Member
4 0 0

I am trying to set up my store with the Debut them. I am stuck at the Image with text overlay section. Every time I upload my picture, it makes it blurry and also cuts it off. I have tried resizing all possible sizes and it's still blurry and cut off. Please help!! this is so frustrating. Something this simple shouldn't be difficult.  I don't understand code stuff =(

0 Likes
Shopify Staff
Shopify Staff
189 31 24

Hello, @namar.

 

Elias here with Shopify Support. Thank you for bringing this to our attention.

 

I’ve tried testing this in my test store; however, I was unable to replicate this problem with the ‘Image with text overlay’ on the Debut theme. I’d be happy to take a closer look at your store and loop in our Theme Support team, this way we can take care of the coding stuff. That said, could you have the image uploaded in that section and share your store address with me? Or, take a screenshot of the issue?

 

Looking forward to hearing from you.

Elias | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
4 0 0

Hi Elias,

 

thank you for reaching out to me! my link is below

 

https://luxe-bear.myshopify.com/

 

0 Likes
New Member
3 0 0

I have the same problem!! Can you please help!

0 Likes
Shopify Staff
Shopify Staff
189 31 24

Hey, @namar.

 

Thank you for sharing your store address. I’ve taken a look at the ‘Image with text overlay’ but I did not see an image uploaded. When I tested this section in my test store, I didn’t encounter this issue. So that I can take a closer look at the issue, could you upload the image you mentioned? Or, could I know the dimension and size of the image you tried uploading?

Elias | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Shopify Staff
Shopify Staff
189 31 24

Hey, @chubbell.

 

No problem at all, I’d be happy to take a closer look and loop in our Theme Support team if there’s a problem. Could you share a screenshot of the issue you’re encountering or let me know your store’s URL?

 

Looking forward to hearing from you.

Elias | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
4 0 0

I uploaded the image on my shopify store which is theluxebear.com , the desktop verision looks fine now but not the mobile version. Picture is cut off on mobile

0 Likes
Shopify Staff
Shopify Staff
189 31 24

Hey, @namar.

 

Thank you for uploading the image. I’ve taken a look at the ‘Image with text overlay’ section, on both desktop and mobile. However, I’m not seeing the image getting cut off on mobile. Here's a couple screenshots of what I'm seeing:

 

Desktop:

13-48-9lgtr-2cq43

 

Mobile:

13-48-sbvv1-j6jk2

 

If you’re seeing something different on mobile, could you share a screenshot from your device? Also, which device and browser are you using on mobile?

Elias | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
4 0 0

it's not that image. It's the image at the top of the website page. The banner page on mobile version. Please see screenshot below.

this picture doesn't fit correctly on mobile version. It's a bit too wide. But it looks good on desktop

Untitled.jpg

0 Likes
Shopify Staff
Shopify Staff
189 31 24

Hey, @namar.

 

Thank you for clarifying. Since larger images won’t be able to fit the same way on all devices, most Shopify themes have a feature to help scale larger images to the height of the browser or adapt to your screen size. 

 

I’m afraid this is not a feature that can be disabled. However, we have a guide for best practices for slideshows and full-width images to help you find the best image sizes or ratios for your slideshow. That said, mobile devices are commonly used in landscape or portrait orientations so we’ll need to take this into consideration.

 

14-56-39ddu-83nkk

 

With the image you’re using, it looks great on larger mobile devices - such as an iPad. Nonetheless, you can increase the background space or make the subject in the center a little smaller so that it doesn’t appear cut off. To do this, you can take the photo further away or place the subject further into the frame.

 

Which other image ratios have you tried for your slideshow image?

Elias | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes