csswordpressmobilegoogle-chrome-devtoolsresponsive

Force mobile navigation menu to remain in open state

I want to apply some custom CSS rules to the navigation menu in WordPress's Twenty Twenty-Four theme. When I click menu, the menu appears. When I right-click and select "Inspect" from the context menu in Firefox or Chrome, the navigation menu closes. How can I get it to remain open?

Solution

  • Thanks to @C3roe for getting me on the right track! I ran this in the console and now my menu stays open!

    document.querySelector('.wp-block-navigation__responsive-container')?.classList.add('has-modal-open', 'is-menu-open');