How do I get my home page banner to be more mobile friendly?

Store Design
, ,

Topic summary

Home page banner on mobile crops to the center of the image; the store owner wants the full image to scale down so it’s entirely visible on smaller screens.

Suggested approach: create two banner sections—one optimized for desktop and one for mobile—and use code to hide the desktop banner on mobile and vice versa (typically via CSS media queries).

Next steps and actions:

  • The store owner asked for implementation help.
  • The helper requested the store URL to provide specific code.
  • The URL was shared: www.blossomclub.com.au.
  • The store owner followed up asking for progress.

Status: unresolved/ongoing. No code snippet or final implementation details have been posted yet. No images or attachments are essential to understanding the issue.

Summarized with AI on December 24. AI used: gpt-5.
1

I have tried a few of the solutions on here but none have been working for my website to mobile. Currently it only selects the centre of my image but ideally I want it to reduce it in size and have it as one whole image

2

Hi @blossomclub

You can create 2 image banner sections, one for desktop and one for mobile, and add code to hide the desktop banner on mobile and vice versa.

3

Hi there, would this be something you’re able to help with please?

4

Could you share your store URL so can give you the code?

5

www.blossomclub.com.au - thank you!

6

Did you have any luck with this?