How can I keep my website header in hamburger style for wider screens?

Topic summary

Main issue: Keep the site header in a persistent “hamburger” (three-line icon that expands navigation) layout on wider/desktop screens for a Shopify store using the Local theme. A store link and a screenshot of the desired mobile-style header were provided.

Feasibility: Multiple replies confirm this is possible to implement so the desktop header mirrors the mobile hamburger menu.

Caveats: Achieving this on desktop likely requires changing the desktop header’s structure in the theme, not just a simple setting or minor CSS tweak.

Recommendations: Consult or hire a professional developer to modify the theme code to support a hamburger-first navigation on larger breakpoints.

Outcome/status: No implementation details, code, or step-by-step instructions were shared. No settings-based solution was identified. The thread has no confirmed resolution and remains open with the suggested next step to seek developer assistance.

Summarized with AI on January 17. AI used: gpt-5.

Hi,

On my site, when the screen is at a certain smaller size, the header is converted to a hamburger menu (as in the pic below). I would like the header to be like that on wider screens also, so that it’s always in “hamburger” style.

Is that possible? Thanks :slightly_smiling_face:

My store (Local theme): https://gryningens.myshopify.com/

What I’m trying to achieve:

Thank you so much :slightly_smiling_face:

That is possible. Can I help you?

Hello @Ivnvu

Yes, it is possible to set the hamburger menu for desktop too similar to mobile. But the structure needs to be changed for desktop. So I recommend you to contact a professional developer.

Thanks