Hide Default Theme Mobile Menu in WordPress
Here’s a simple and easy way to hide the default mobile menu in WordPress:
Method 1: Using Custom CSS
This is the quickest way to hide the mobile menu without needing a plugin.
- Access the Customizer:
- Go to your WordPress dashboard.

-
- Navigate to Appearance > Customize.

- Open Additional CSS:
- In the Customizer, find and click on Additional CSS.

- Add Custom CSS Code:
- Copy and paste the following CSS code to hide the mobile menu:
css
/* Hide the default mobile menu */
.mobile-nav, .mobile-menu, .your-menu-class {
display: none !important;
}
- Replace
.mobile-nav,.mobile-menu, or.your-menu-classwith the correct class name if you know it. You can find the class name by inspecting the mobile menu using your browser’s developer tools.

- Publish Changes:
- Click Publish to save and apply your changes.

Method 3: Using a Plugin (Optional)
If you prefer using a plugin:
- Install a Custom CSS Plugin:
- Go to Plugins > Add New.
- Search for and install a plugin like “Simple CSS” or “SiteOrigin CSS.”

- Add Custom CSS:
- After activating the plugin, go to the plugin’s settings page or the Customizer to add the custom CSS mentioned in Method 1.
- Publish Changes:
- Save and publish your changes.
These methods allow you to easily hide the default mobile menu in WordPress with minimal effort.