I am having an issue with the photo on the homepage of my website. It displays perfectly on the web view but is cut off and not resized to show in full on the mobile view. I am using the Debut Theme and its just an Image in that section. My site is www.graceandfur.com
1 Like
Hi, @RichelleMS .
What a lovely store you have! I really like how you’ve curated your storefront, used neutral tones and made it easy to navigate.
I understand that you’re using Debut theme and would like to resize the banner image to fit on mobile view. I can see from the screenshots that you’ve provided that the banner displays as expected on desktop view but seems to be cut off when viewing in mobile.
I had a chance to navigate to your store on desktop and mobile to take a closer look. On mobile, your homepage banner displaying your brand name / logo appears to fit the screen with no cut off edges or images. When resizing images within the theme editor, the edits applied to desktop will reflect on mobile view. The dimensions are scaled to fit the screen depending on what device you’re viewing it from.
I would like to make a few suggestions for Debut theme and some workarounds. Debut theme image sizing is 1200 to 2000 px in width and 400 to 600 px in height. If you wish to resize images in order to fit the banner, I suggest looking into the image editor within your Shopify admin. You’re able to scale, resize, crop and change an images orientation.
A second workaround is using Shopify’s online image resizer & optimizer. You can upload and resize your images directly through the link above. Feel free to browse through the FAQ section to learn more about how the image resizer works, how image resizing affects quality and what is a good size to resize images.
Additionally, you can use an app like Photo Resize that allows you to bulk resize images, make images square shaped and much more. Click into the app to learn more about it’s benefits and features.
Lastly, I’d like to make one recommendation for your store that I feel can help with brand visibility and having a cleaner footer section. Did you know that you can remove the powered by Shopify text from your footer? Once this is removed, customers will see your brands name which will help with brand recognition and professionalism. I’ll share the resource here on Remove Powered by Shopify, that includes steps and a video to remove this text.
After I posted I did resize the image and made it work for both, thank you!!
Also, thank you for telling me about removing the “powered by Shopify”. I just removed it and it looks so much better. Thank you so much!