Genesis Mobile Menu Not Working: Find Out Which Script Owns the Button

Five ways a Genesis phone menu goes missing

Owners describe this fault in different words, and the words are clues. Before you change a setting, write down what you see, on which page, on which phone and at roughly what screen width. A menu that fails for everyone points at the script. A menu that fails only for logged-out visitors points at a cache or an optimizer. A menu that misbehaves only on a tablet held sideways points at a breakpoint.

• No button and no links. Below a certain width the header is empty. The navigation is still in the page source, just hidden.
• The word Menu with no icon. The toggle exists, but the icon font that draws the three lines never loaded.
• A tap that does nothing, or opens and snaps shut. Either nothing is listening for the click, or two scripts are each handling it.
• The whole desktop menu stacked down the screen. The script never claimed that menu, so it renders as a long plain list.
• Parent items that open a page instead of a submenu. The small arrow buttons that reveal child links were never added.

Genesis has shipped two menu systems, and your child theme picked one

Before June 2019, every Genesis child theme brought its own mobile menu. Genesis Sample, the starter that countless custom themes were copied from, enqueued a responsive-menus.js file from its own js folder, declared jQuery as a dependency and handed the script its settings through a JavaScript object called genesis_responsive_menu. Sample 2.6.0 still worked that way, and also loaded a second genesis-sample.js file that needed jQuery too.

Genesis 3.0.0 moved the job into the framework. A child theme now calls genesis_register_responsive_menus() with a config array, usually read from config/responsive-menus.php, and the framework enqueues the script. Genesis Sample 3.0.0 deleted its own menu scripts in favor of that function. StudioPress documents the new menu API as independent of Superfish, the old dropdown helper that Genesis 2.0.0 stopped loading by default in 2013. Superfish comes back only if something filters genesis_superfish_enabled to true.

Two values in the 3.0 config decide most outcomes. The menuClasses list names which menus become responsive, and media_query_width sets the width below which the script takes over. The framework's default list names no menus at all, and its default width is 1023px. Genesis Sample overrides both: it lists .nav-primary and sets 960px, the same width its stylesheet uses to show and hide the toggle.

Six suspects, most likely first on a Genesis site

1. An optimizer held the script back while CSS hid the menu

Since version 3.4.1, Genesis Sample swaps a no-js body class for js as soon as the page starts, and its stylesheet hides .nav-primary on narrow screens whenever that js class is present. The toggle button only exists once the menu script runs. If a caching plugin delays JavaScript until the visitor interacts, or bundles it into a file that fails, the menu is hidden and no button arrives to reveal it. Check: switch off script delay and combining in your optimizer, purge, and reload on a real phone.

2. The menu sits in a location the script ignores

The script only touches menus whose classes appear in its list. On Genesis Sample that is .nav-primary, the location labeled Header Menu under Appearance, then Menus. A menu assigned to the Footer Menu location, or dropped into a Navigation Menu widget in the header, reaches phones untouched. Check: confirm which location holds your main menu and compare it with the classes named in config/responsive-menus.php.

3. The config never reaches the framework

Hand-edited child themes sometimes lose the registration call, or keep it and lose the config file. With the framework's empty default list, the script loads and has nothing to do. Check: search functions.php for genesis_register_responsive_menus, then confirm the config file exists and names the class your menu actually uses.

4. Two menu scripts answer one tap

Some pre-3.0 child themes were modernized halfway: the framework registration went in, the old enqueue of js/responsive-menus.js stayed. Each script can add its own toggle and listen for the same click, which shows up as two buttons, or a panel that opens and closes in one tap. Check: in the browser's Network panel, filter by menu and count the scripts.

5. The stylesheet and the script disagree about width

CSS decides when the toggle is visible; media_query_width decides when the script behaves as a mobile menu. Change one and not the other, or drop the width from the config so the 1023px default runs against a 960px stylesheet, and a band of tablet widths gets a menu stuck between modes. Check: drag the browser window narrower slowly and note where behavior flips.

6. The icon font was switched off

The framework's defaults and Genesis Sample both draw the hamburger with dashicons classes, which is why the Sample enqueues the dashicons stylesheet on the front end. Speed snippets that remove dashicons for logged-out visitors take the icon with them. Check: compare the header logged in and logged out.

Bringing the Genesis menu back on a staging copy

1. 1

   Reproduce it logged out

   Use a private window and a real phone. Record the page, the width where it fails and any red errors in the browser console.

2. 2

   Switch off script optimization

   Turn off delay, combine and minify for JavaScript in your caching plugin, purge every cache and test. If the menu returns, exclude the menu script and jQuery from optimization instead of leaving everything off.

3. 3

   Confirm the menu location

   Under Appearance, then Menus, assign the main menu to the primary location your child theme registers, and remove any duplicate navigation widget from the header.

4. 4

   Read the registration

   On a child theme for Genesis 3.0 or later, call genesis_register_responsive_menus() inside a function hooked to after_setup_theme, as Genesis Sample 3.4.3 does, and keep config/responsive-menus.php in the theme.

5. 5

   Retire the old script

   If the child theme predates Genesis 3.0, remove the enqueue of its old responsive-menus file and any jQuery helper that only served it, then register the framework menu. Run one system, never both.

6. 6

   Match the breakpoints

   Set media_query_width to the width at which the stylesheet hides .menu-toggle, then test a few pixels either side of it.

7. 7

   Restore the icon and retest

   Load dashicons again, or point menuIconClass at an icon set the theme already loads. Test parent items with submenus on iPhone and Android before you copy the fix to the live site.

If the console shows an error from another plugin before the menu script even starts, the menu is a victim, not the cause. Our guide to theme JavaScript errors covers how to trace that kind of chain.

Habits that keep a Genesis menu tappable

Repeat failures almost always start somewhere other than the menu. A new optimization plugin. A child theme file edited on the live server. A forum tip about removing dashicons for speed. Write three facts in a README the next developer will find: which menu system the child theme runs, the breakpoint, and which scripts are excluded from optimization.

• Keep Genesis current. As of October 2026 the latest release is 3.6.2, and the patches since 2022 are the compatibility fixes you want in place before debugging anything else.
• Test the phone menu after every plugin update that touches scripts, not only after theme updates.
• Edit the child theme on staging and keep it in version control, so a half-finished change like a doubled menu script never reaches visitors.
• Add a logged-out phone check of the menu to the monthly routine, or let our hosting and maintenance plans run it for you.

The cross-theme version of this problem, including block navigation and builder headers that Genesis sites rarely use, is in our WordPress mobile menu guide. If the old jQuery scripts are also dragging on speed, the Genesis speed guide covers retiring them.

When every header change means editing PHP

A Genesis header is assembled by hooks. Moving the menu, adding a call button or changing the breakpoint is a code change spread across functions.php, a config file and the stylesheet, kept in agreement by hand. With a developer on call, that is a tidy arrangement. It wears thin when the site exists to make the phone ring and the person fixing it is the owner, late, with a tutorial open in another tab.

Three files have to agree before a phone shows three lines.

A Next.js build keeps the header, the breakpoint and the menu behavior in one component, tested before it ships, with no plugin rewriting scripts on the live server. It costs more up front, and structural changes still need a developer. Genesis vs Next.js sets out that trade, and Genesis to Next.js explains the move, with every old URL kept or redirected. Owners keep editing their own pages in Athena CMS.

Staying is often the right call, and our Genesis review says who should. If you want the menu fixed by someone else, our theme troubleshooting service works on a staging copy first. Other Genesis fixes: PHP errors, a broken layout and CSS that will not update. Everything else is in the troubleshooting section.