Problem Footer Size too long

Topic summary

Issue: On mobile, the store’s banner looked too small and the footer appeared excessively long. The author shared desktop/mobile screenshots to illustrate layout problems.

Proposed fix: A responder suggested making the footer collapsible on mobile by:

  • Adding custom code into theme.liquid before (via Online Store > Themes > Edit code).
  • Editing footer.liquid to include “block-collapsed” after a specific code section, with a screenshot indicating exact placement.

Outcome: The original poster later confirmed the solution worked “amazingly,” indicating the mobile footer issue was resolved. No follow-up changes were provided for enlarging the banner on mobile.

Status: Resolved for the footer (now collapsible on mobile). The banner resizing request remains unaddressed in the thread.

Notes: Images were central for understanding the layout issue. The exact code content wasn’t fully detailed in the posts, but the steps and file locations were specified.

Summarized with AI on December 26. AI used: gpt-5.

Hello creators, developers, helpers, World conquerers… hehe

I have a problem with my website, I’m really bad at CSS and my banner and footer on mobile are awful !

Is there a way for me to make the banner bigger only on the mobile version and reduce the size of this footer.

Thank you very much

www.irasshai.store

Desktop Version

Mobile version

Desktop Version

Mobile version

Hi @Kcyremia

You can add this code to your theme.liqud file, before in Online Store > Themes > Edit code to change your footer to collapsible on mobile device


After that, open footer.liquid file, find this part of code


Add this code after it **block-collapsed** so it will change to this

```markup

![Screenshot 2024-05-22 at 10.34.33.png|1006x374](upload://4hc1GtFT0PbbOhkyvHSvgP815mp.png)
1 Like

Hello !

I’m so sorry for the late reply, so many problems these past few weeks !
That works amazingly ! Thank you very much for your help and especially your time for it