Remove Home Page Menu only From Home Page

Remove Home Page Menu only From Home Page

Why should we remove or hide?

One of my customers ordered me to remove the home page menu link from WordPress menu only on Home Page. It looks meaningless when I first hear but I understand why he is interesting. Client thinks “visitors already on the home page why should I show the home page menu”. So I help him to remove WordPress menu item from the home page.

Another reason why people get rid of the Home Page Menu item, because we really use WP Menu bar carefully. Logo has links to the home page. If you already have a link to your home why would you duplicate the link?

We are a programmer, we code a lot and this makes us a robot sometimes. Listening to the clients make us more human 🙂

PHP Code Method

I made it with PHP Code, I use WordPress Filter (wp_nav_menu_objects) and I thought someone also needs this. I added my WordPress snippets so you can use them freely on your projects.

You should put this snippet to the functions.php file.

add_filter( 'wp_nav_menu_objects', 'amc_filter_menu', 10, 2 );
/**
 * Filters to remove Home Link on Front Page
 */
function amc_filter_menu( $objects, $args ) {

	// Return Default Value if the Menu isn't Main Menu
  // Replace "Navigation_location" with your target location
	if ( 'Navigation_location' !== $args->theme_location ) {
		return $objects;
	}

	// Detect the Menu which equeal site URL
	foreach ( $objects as $key => $object ) :

		if ( get_site_url( null, '/' ) === $object->url && is_front_page() || get_site_url() === $object->url && is_front_page() ) :
			unset( $objects[ $key ] );
		endif;

	endforeach;

	// Return the menu objects
	return $objects;

}

Alternative Way: Use CSS to hide Home Page Menu

OK PHP is a more proper way but if you don’t want to deal with PHP you can use CSS to hide the menu item. I am not talking about removing because there is no way to remove the menu item with CSS code. We only hide the specific menu from visitors.

Each menu item has a unique class name so we need to find the class. You need to inspect the page with your browsers with right-click.

Then put this Custom CSS codes to Appereance > Customize > Additional CSS section.

.home .menu-item-58{
 display: none!important;
}

or 

.blog .menu-item-58{
 display: none!important;
}

Note: You can hide any menu item if you find the right class.

Remove It With WordPress Plugin – If Menu

There is a plugin for this purpose and more advanced purposes. I don’t suggest using a plugin for basic things because it may affect your SEO or site speed if you use too much plugins.

Download Plugin from here

Enable Rules for the item and click hide for Front Page.

After Open Appearance > Menu page and open the home page item.

I hope one of them helps you. Comment if you know an alternative method or it’s doesn’t work on your site.

Comments (0)
Join the discussion
Read them all
 

Comment

Hide Comments
Back

This is a unique website which will require a more modern browser to work!

Please upgrade today!

Share