What is the recommended image size for my Square Online Store banner?

[Dek]

The title of this post has been edited from the original: Square Online: Mobile view looks oddly big.

When I toggle between Desktop view & Mobile view, the banner images looks big and cropped out or cut off on the mobile. What size banner do we need? Pixel? Help. Thank You.

[AshleyK · Accepted solution]

Hey @Dek and welcome to the Seller Community! The typical image size for the banners is around 2000 pixels by 1000 pixels but can vary depending on the content of the header image itself. 

Let me know if those image sizes help at all!

[Dek]

Thank you for your answer. I'll try. Appreciated your time. I'm new to square discussion group. Sorry for the late reply.

[HOOVERSCANDY]

I too am struggling with this!  I've tried everything I can think of and nothing is working

[nika]

Hi @HOOVERSCANDY! Is it the banner size that you're having trouble with or is there a different image that's appearing larger than what you're expecting?

[Krishnas]

My image is within the recommended pixel size. One version displays well in the desktop view but cuts off in the mobile and vice versa on using a second version of the image. How do I get something to work with both or load different versions for each display.

[RGL1]

I'm having the same issue. Very Frustrating. The Mobile and Desktop load completely different, cutting off parts of my image. 

[BernadetteA]

Thanks for posting, @RGL1 and Welcome to the Seller Community 👋

Can you please post a link to your website so we can take a look? 

[lesleeortega]

I have tried 2880 x 1144 and 2000 x 1000. Neither fits the banner on the desktop site- too short and too wide.  Why is this information not readily available?  I've spent hours trying to get this to look right. 

[PM1973]

on my website https://www.shadowsinthedark.com/ i have my images set to: 300 x 300

[YarnSeasons]

I don' t see that this works at all.  I made the image 2000 by 1000 and it still won't fit correctly.  I don't understand why there isn't clear documentation on how to do this. I am paying for the privilege of having a site the least they could do would be to give us the information we need to do that correctly. Very frustrating.

[CreativeCarla]

I've tried this, it doesn't work. The banner image still doesn't fit, it looks horrible!!! So frustrated at this point I'm changing the header image - which I absolutely love & it fits my branding perfectly, it sucks that there's no solution for this problem.

[JJ_]

Hey there @CreativeCarla 👋

Have you tried contacting our support team? 

They can take a look at your site with you to help a shine light here, as they are able look at your site alongside you in order to pinpoint what's going on here. Please reach out by phone or email when you have a moment by logging into your Square account and heading here.

[stashpad]

It's crazy that Square doesn't have an answer for this. I've been building websites since the 90s and this is beyond frustrating. I can't tell you how many times I've gone into photoshop to adjust images sizes and just remake and remake and remake them only to have them still come out blurry/zoomed in. Of every e-commerce website I've ever built Square has been the worst for customization. Even if I write code and embed it, it doesn't come out right. So... yeah... I too would love an actual answer that works. I've probably made 30+ images at this point for my header image and none of them ever come out right. Beyond infuriating.

[PM1973]

Try sizing your images to either 300 x 300 or 500 x 500 and see how that goes.

[RedBird7]

I've tried sizing my image down in increments of 100 from the 2000 pixel width all the way down to 300. All is does is blur the image but it still stays the same size in the banner cutting off the edges of the image. 

[TripperD]

This is marked as the best answer but it doesn’t answer the question. How do you get an image to work both in mobile and desktop? Is there a setting that will display your full banner in both?

[Ria]

Hi @TripperD - Welcome to The Seller Community, it's always nice to see a new face 😊

Great Observation.

I'm happy to look into this further for you to see if there is a setting that will allow your images to reflect appropriately based on the device preference. 

Happy to check back in with you as soon as I receive feedback from our engineers. 

As always, feel free to stop by The Community with question, concerns and even feature requests. We are more than happy to assist. ✨

[TFOIN]

This thread has gone on for a year and a half, if not more. What seems to be the hold up in getting this issue fixed. Honestly, its a big enough issue that I am considering leaving Square. How am I support to present a professional looking website to customers with such an issue? The mobile version looks ridiculous. 

[Ria]

Hi @TFOIN - Welcome to The Seller Community, it's always nice to see a new face 😊

I totally understand your concern.

To better assist our engineers, are you able to provide screenshots of your issue?

As always, feel free to stop by The Community with question, concerns and even feature requests. We are more than happy to assist. ✨

[Jeff48k]

I am having the same issue, no matter how I see the graphic it gets cut off.