Hamburger menu

Store Design
,

Topic summary

A Shopify store owner’s hamburger menu unexpectedly changed to a ‘Search’ button and they need help reverting it back.

Proposed Solution:

  • Add CSS code to hide the inline menu and display the header drawer on desktop screens (min-width: 990px)
  • Target file: theme.css or base.css (depending on theme structure)

Implementation Issue:

  • Initial attempt failed because the user added code to theme.liquid instead of the CSS file
  • The theme lacks a theme.css file

Clarification Provided:

  • If theme.css doesn’t exist, paste the CSS code at the end of base.css instead
  • Navigate to: Online Store → Themes → Actions → Edit Code → base.css

The discussion remains open as the user hasn’t confirmed whether the corrected approach resolved the issue.

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.
1

Hello guys!

I am currently going through my Shopify website (www.veloir.co.uk - nemael).

My hamburger menu has turned into a ‘Search’ button, is there any way you guys know how I can change it back to the hamburger menu?

I don’t know how I made it change to a ‘Search’ button, probably my not so great coding skills lol

Thank you in advance.

IMG_2542.jpg
IMG_2542.jpg1284×1528 180 KB

1 Like
2

Hello @JAKUBPLU

Go to online store ----> themes ----> actions ----> edit code ----> theme.css
add this code at the end of the file and save.

@media screen and (min-width: 990px) {
.header__inline-menu {
display: none !important;
}
header-drawer {
display: block !important;
}
}

result

15.png
15.png1344×441 248 KB

If this was helpful, hit the like button and accept the solution.
Thanks

3

Hi, I have added this into theme.liquid as I do not have theme.css and it did not work :confused:

4

If your theme don’t have theme.css file then you need to paste it in base.css file.

Go to end of base.css file and paste the code that provided by @GTLOfficial

Thanks

1 Like