[Resolved] Remove container for menu bar items

[akal]

Hi,
since 3.0.0 you’ve add a container for menu bar items. I would like to remove it. For that, I’m using :

add_action( 'generate_after_primary_menu', 'generate_move_menu_bar_items' );
function generate_move_menu_bar_items() {
	 do_action( 'generate_menu_bar_items' );	
}

which duplicate all menu bar items (menu, search, basket…) without the menu-bar-items div container. This is cool but not how can I remove the original “menu-bar-items” (that I’ve temporally hidden with display:none; ) ?

Also, is there a way to prevent adding “hide-on-mobile” class on the <span class=”menu-bar-item slideout-toggle”> when on mobile ? I would like to keep the menu visible on mobile
Look here => https://aspcc.gatcom.fr/boutique/stages/

Could you please help me with that ?
Best regards
akal

[David]

Hi there,

1. in Customizer > Layout > Header, disable the Mobile Header option. As it’s not being used.
2. in > Off Canvas Panel set this to Mobile Only.
3. in Layout > Primary Navigation, set the mobile menu breakpoint to a really high value eg. 100000. You will need to type into the field.

What this will do is to display the mobile layout on all device sizes, removing any duplicate navs and the css that would hide the slideout toggle.

For the PHP replace your snippet with:

// remove the menu_bar_item_container
add_action('wp', function(){
    remove_action( 'generate_after_primary_menu', 'generate_do_menu_bar_item_container' );
});
// add the generate_menu_bar_items hook outside of the missing container
add_action( 'generate_after_primary_menu', 'generate_move_menu_bar_items' );
function generate_move_menu_bar_items() {
    do_action( 'generate_menu_bar_items' );	
}

[akal]

Hi David,
in point 3 there is no option to change Mobile Menu Breakpoint, so I think you would talk about Layout -> Primary Navigation ?
I’ve done your setting and paste your code, I understand now and Working as expected 🙂
Many thanks ^^
akal

[David]

Aah yes, silly me 😉 i updated the reply above.
Glad to hear it is working !

[akal]

Hi David,
no pb was obvious ^^

I would like to mention there is a little JS issue on click to the menu burger (left side)
https://aspcc.gatcom.fr/

menu.min.js?ver=3.2.4:1 
Uncaught TypeError: Cannot read properties of undefined (reading 'setAttribute')
    at HTMLButtonElement.s (menu.min.js?ver=3.2.4:1:2126)

Don’t know if it comes from my side ?
akal

[David]

Hmmm… i think it is to do with that we are forcing mobile menu, when we probably want to do it the other way around.
ie.

1. set the Primary Navigation breakpoint to a 0
2. set the Off Canvas Panel to ON

The only thing that would require, is that you create a Blank Menu and assign it to the Primary Menu – this will stop WP from auto populating the menu.

[akal]

I realized I’ve already created blank menu assigned to the Primary Menu (from the very begining).
So I’ve just remove it and no JS issue anymore, and the menu is working as expected so I think we are done here.
Many thank for your support David ^^

[David]

Glad to be of help

[Author]

Posts