Cacher is the code snippet organizer for pro developers

It is quite simple to get the accessible hamburger menu working for .nav-secondary in Genesis Sample 2.3. All we have to do is pass the nav menu’s class as the value for the others key in $settings array inside genesis_sample_responsive_menu_settings() in functions.php.

// CHANGE THE FOLLOWING CODE TO THE NEW CODE BELOW IT...

// Define our responsive menu settings.
function genesis_sample_responsive_menu_settings() {

    $settings = array(
        'mainMenu'          => __( 'Menu', 'genesis-sample' ),
        'menuIconClass'     => 'dashicons-before dashicons-menu',
        'subMenu'           => __( 'Submenu', 'genesis-sample' ),
        'subMenuIconsClass' => 'dashicons-before dashicons-arrow-down-alt2',
        'menuClasses'       => array(
            'combine' => array(
                '.nav-primary',
                '.nav-header',
            ),
            'others'  => array(),
        ),
    );

    return $settings;

}

// CHANGE THE ABOVE CODE TO THE NEW CODE BELOW

// Define our responsive menu settings.
function genesis_sample_responsive_menu_settings() {

    $settings = array(
        'mainMenu'          => __( 'Menu', 'genesis-sample' ),
        'menuIconClass'     => 'dashicons-before dashicons-menu',
        'subMenu'           => __( 'Submenu', 'genesis-sample' ),
        'subMenuIconsClass' => 'dashicons-before dashicons-arrow-down-alt2',
        'menuClasses'       => array(
            'combine' => array(
                '.nav-primary',
                '.nav-header',
            ),
            'others'  => array( '.nav-secondary' ),
        ),
    );

    return $settings;

}

/*--- Note: To get rid of top border above the menu icon, in style.css add ---*/


.site-footer .menu-toggle {
    border-top: none;
}

/*--- above ---*/

.menu-toggle,
.menu-toggle:focus,
.menu-toggle:hover {
    border-top: 1px solid #eee;
}

/*--- in the 1023px media query. ---*/