Hide the Navigation Menu on Your WordPress Blog (Without Plugins)

There are two main ways to disable the navigation menu on your WordPress blog pages:

1. Using the Built-in Menu System:

This method works well if you only want to hide the menu on blog pages and not other parts of your website.

  • Access the Menu Editor: Login to your WordPress dashboard and navigate to Appearance > Menus.
  • Select the Menu: Choose the menu you want to modify from the “Select a menu to edit” dropdown.
  • Menu Locations: Expand the “Menu Settings” section. Look for a checkbox or dropdown menu under the “Menu Locations” heading.
  • Uncheck Blog Page: The option might be labeled “Primary Menu,” “Navigation Menu,” or something similar depending on your theme. Uncheck the box next to “Pages” or specifically “Blog” if the option exists.
  • Save Menu: Click the “Save Menu” button to apply the changes.

2. Using a Custom CSS Code:

This method offers more flexibility but requires adding some code.

Access the Customizer: Go to Appearance > Customize.

  • Find Additional CSS: Locate the “Additional CSS” section (placement might vary slightly based on the theme).
  • Add CSS Code: Here, you can add CSS code to target the menu element and hide it on specific pages.

Here’s an example CSS code to hide the navigation menu on all blog pages:

body.is-blog .site-navigation {
  display: none;


  • body.is-blog targets the entire body element when you’re viewing a blog page (WordPress adds this class to the body on blog pages).
  • .site-navigation targets the main navigation menu element (class name might vary based on your theme).
  • display: none; hides the targeted element (the menu).

Related Posts

Notify of
Inline Feedbacks
View all comments
Would love your thoughts, please comment.x
Artificial Intelligence