Hi everyone,
I want to hide the hamburger menu and cart from my website when visiting on mobile. I was able to do this myself for the desktop view, but for some reason I’m struggling with the mobile view. Any help would be greatly appreciated.
Topic summary
A user needed to hide the hamburger menu and cart icons on mobile view after successfully hiding them on desktop.
Solution Provided:
- Navigate to Online Store → Theme → Edit code
- Open the theme.liquid file
- Add CSS code before the
</body>tag targeting mobile devices (max-width: 767px) - Use
display: none !importantto hide.site-nav--mobile .icon-hamburgerand.site-nav--mobile .icon-cartelements
Outcome:
The original poster confirmed the solution worked after struggling for several hours. An alternative suggestion involved placing code below the <head> tag, though the accepted solution used the </body> placement method.
Hello @Freejogger
You can add code by following these steps
-
Go to Online Store → Theme → Edit code.
-
Open your theme.liquid file
-
Paste the below code before on theme.liquid
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution
2 Likes
Hey @Freejogger ,
Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.
Screenshot is for reference only, the correct code to paste is the one shown above.
Thanks @niraj_patel !! You saved me after trying for several hours 
welcome @Freejogger 