How to remove the menu button from the mobile version?

Zuips · ‎09-02-2024

Hey ive figured out how to make it not show anymore but the button is still there... how can i remove the menu icon from mobile? theme: showcase URL: www.zuips.com

thanks ❤️

niraj_patel · ‎09-02-2024

Hello @Zuips

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (max-width: 767px) {
.site-control .menu {
display: none !important;
}
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

View solution in original post

topnewyork · ‎09-02-2024

Hi @Zuips ,

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head>

<style>
  .site-control .menu {
    display: none !important;
}
</style>

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!

Need a Shopify developer? Hire us at Top New York Web Design
Boost Your Store Sales with Volume/Tier Discount Try Big Bulk Discount
Create New Shopify Store For Just 1$/Month

niraj_patel · ‎09-02-2024

Hello @Zuips

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (max-width: 767px) {
.site-control .menu {
display: none !important;
}
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

Zuips · ‎09-02-2024

thank you sooooo sooo much!!! 🙂 worked perfectly

GTLOfficial · ‎09-02-2024

Hello @Zuips
Go to online store ----> themes ----> actions ----> edit code ---->assets ---->styles.css
add this code at the end of the file.

.site-control .menu .icon-menu {
display: none;
}

result

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

- Buy me a Pizza
- If helpful then please Like and Accept Solution.
- Want to modify or custom changes or bug fix on the store Hire me. GTL web solutions
- Want Complete Storefront: Send an email ⇨- Email: info@gtlofficial.com - Skype: ritesh_27dh

Zuips · ‎09-02-2024

I implemented code already! too scared to see if that works too xD

Huptech-Web · ‎09-02-2024

Hello @Zuips, Please follow these steps to add this CSS code:

1. Access your Shopify Admin.
2. Go to Online Store > Themes.
3. Locate the theme you are currently using and select Actions > Edit code.
4. In a CSS file: Go to Assets, find your CSS file, and add your styles OR find the styles.css file. OR
5. In theme.liquid: Go to Layout, open theme.liquid, and add your CSS inside a <style> tag in the <head> section.

.site-control .menu {
    display: none !important;
}

Here is the screenshot of the same.

Feel free to reach out if you have any additional questions. If this solution is helpful, please consider liking and accepting it.
S.P

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at info@huptechweb.com or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required

How to remove the menu button from the mobile version?

How to remove the menu button from the mobile version?

Community Blog Articles