Split Navigation in Genesis Sample 2.8.0

This members-only tutorial provides the steps to display primary navigation menu at the left, title area in the middle and secondary navigation menu at the right in Genesis Sample 2.8.0.

Between 960px and 1399px (inclusive) we shall center the site header elements one below the other.

959px and below, it will appear as usual.

Tested in Genesis Sample 2.8.0 and Genesis 2.8.1

Step 1

Edit Genesis Sample's functions.php.

a) Let's combine the primary and secondary menus in the mobile menu.

Change

/**
 * Defines responsive menu settings.
 *
 * @since 2.3.0
 */
function genesis_sample_responsive_menu_settings() {

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

	return $settings;

}

to