[Support request] Any way to remove the menu-toggle button (not just hide it)?

[Mike]

So GP outputs the mobile menu button in the header like this:

<button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false">
<span class="mobile-menu">Menu</span>
/button>

Because I use a different menu plugin which comes with its own regular and mobile menu, it changes the ID of the primary menu to something than than primary-menu, then sets the menu-toggle class to display:none, which of course works as intended.

But because the button HTML is still there, I get an HTML validation error that basically complains the “arial-controls” attribute must be set to a valid local element (primary-menu) which no longer exists.

I know this is a trivial issue, but it happens to be the *only* validation error I have lol.

So is there way to remove that button code completely using some hook or something?

Thanks.

[Tom]

Unfortunately it’s not hooked in, so we can’t un-hook it: https://github.com/tomusborne/generatepress/blob/2.1.2/inc/structure/navigation.php#L33-L36

Are you not using the GP menu at all? If not, we can definitely remove it from the source.

Let me know 🙂

[Mike]

Hi Tom,

Remove it from the source as in edit out the button code from my template file?

Thanks.

[Tom]

There’s other ways to do it, but it depends how you’re using the menu system now.

Does your menu plugin only replace the inner contents of the core navigation element, or does it add a whole new element?

[Mike]

Hi Tom,

I believe it simply replaces the inner #primary-menu of GP with #mega-menu-wrap-primary. It depends on the same menu items and location etc. It does add its own mobile button toggle, but it places it inside the main menu div rather than outside like GP does.

Thanks!

[Tom]

That’s a shame.

In that case, we’d need to overwrite the entire function. If you do this, keep an eye on future updates to make sure you make any necessary changes to the function.

You can add this in your child theme functions.php file:

if ( ! function_exists( 'generate_navigation_position' ) ) {
	function generate_navigation_position() {
		?>
		<nav itemtype="https://schema.org/SiteNavigationElement" itemscope="itemscope" id="site-navigation" <?php generate_navigation_class(); ?>>
			<div <?php generate_inside_navigation_class(); ?>>
				<?php
				/**
				 * generate_inside_navigation hook.
				 *
				 * @since 0.1
				 *
				 * @hooked generate_navigation_search - 10
				 * @hooked generate_mobile_menu_search_icon - 10
				 */
				do_action( 'generate_inside_navigation' );
				?>
				<?php
				wp_nav_menu(
					array(
						'theme_location' => 'primary',
						'container' => 'div',
						'container_class' => 'main-nav',
						'container_id' => 'primary-menu',
						'menu_class' => '',
						'fallback_cb' => 'generate_menu_fallback',
						'items_wrap' => '<ul id="%1$s" class="%2$s ' . join( ' ', generate_get_menu_class() ) . '">%3$s</ul>'
					)
				);
				?>
			</div><!-- .inside-navigation -->
		</nav><!-- #site-navigation -->
		<?php
	}
}

[Mike]

Hi Tom,

The code worked. If I understood this correctly, this whole block of code you provided here is basically a duplicate of the whole original main navigation menu function, minus the mobile button, correct?

That means if future GP updates modify the menu in anyway, I probably will have to edit these codes to match that of the updated GP menu. If that’s the case, I don’t think it’s worth the potential risk/hassle for the button validation.

Unless, in a future GP update, you may consider adding some logic to not output the button code if primary-menu has been removed or replaced, or provide a hook to remove just the button :)))

Thanks Tom as always. I feel bad for even bothering you with issues like this. But your super clean theme and your constant effort to making it even cleaner (like the recent fontawesome removal) is spoiling us. I wonder if at some point you’ll throw the towel and draw a line. Haha.

[Tom]

Hi Mike,

That’s correct. I’d like to hook to the mobile menu into the navigation instead, however it may cause some backward compatibility issues with people that have overwritten the entire function (as I suggested above).

As long as people use GP, I’ll continue to make it better 🙂

[Author]

Posts