This guide is applicable for Genesis Sample theme > 2.9. For older version check this tutorial.

By default the Secondary Menu in Genesis Sample theme is placed inside Footer section. To relocate this menu to below the site header we need to follow the steps as mentioned below:-

Step 1: Open /themes/genesis-sample/config/menus.php and change the text as follows.

return array(
 'primary'   => ( 'Header Menu', 'genesis-sample' ),     'secondary' => ( 'Secondary Navigation', 'genesis-sample' ),
 );

Step 2: Delete the following from /themes/genesis-sample/functions.php

// Repositions the secondary navigation menu.
 remove_action( 'genesis_after_header', 'genesis_do_subnav' );
 add_action( 'genesis_footer', 'genesis_do_subnav', 10 );

Step 3: Edit Responsive menu settings from functions.php

$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',
             '.nav-secondary',
         ),
         'others'  => array(),
     ),
 );

Step 4: In /themes/genesis-sample/js/genesis-sample.js change the following line

$( '.site-inner' ).css( 'margin-top', siteInnerMarginTop );
into

$( '.nav-secondary' ).css( 'margin-top', siteInnerMarginTop );

Step 5: In /themes/genesis-sample/style.css inside the media query change the following:

 
.site-inner {
margin-top: 70px;
max-width: 1140px;
} 

to

.site-inner {
margin-top: 0;
max-width: 1140px;
} 
 

Step 6: In /themes/genesis-sample/style.css change the following:

/* Footer Menu
 --------------------------------------------- */
 .nav-secondary {
     margin-top: 10px;
 }
 .nav-secondary .genesis-nav-menu {
     line-height: 1.5;
 }
 .nav-secondary .menu-item {
     display: inline-block;
 }
 .nav-secondary a {
     margin-left: 10px;
     margin-right: 10px;
     padding: 0;
 }
to

/* Secondary Navigation
 --------------------------------------------- */
 .nav-secondary {
     clear: left;
     padding: 15px 0;
     background-color: #eee;
     width: 100%;
 }
 .nav-secondary .menu-item {
     display: inline-block;
 }
 .nav-secondary a {
     padding: 10px 15px;
     color: #333;
 }

Step 7: In /themes/genesis-sample/style.css inside the media query add the following:

.nav-secondary .wrap {
     max-width: 960px;
     margin: 0 auto;
 }

That’s it.

How to add a search box in primary menu of a genesis theme which is located at the site header. This is applicable for secondary menu also.

First of all, add the following code inside the functions.php file:

// Add a Search Bar to PRIMARY Navigation Menu
add_filter( 'wp_nav_menu_items', 'theme_menu_extras', 10, 2 );
function theme_menu_extras( $menu, $args ) {
if ( 'primary' !== $args->theme_location )
return $menu;
$menu  .= '<li class="search-bar">' . get_search_form( false ) . '</li>';
return $menu;
}

If you want to add a search box in secondary menu, you need to change the word, “primary” to “secondary”.

After adding the code the the site header will look like:-

Now add the following code inside media only screen section of style.css:-

.genesis-nav-menu > .search-bar {
float: right;
}

Now, we should either remove the search button or place the button inline with the search box. To achieve this we need to make some modification in our style.css file.

.search-form input[type="search"] {
width: 60%;
float: left;
}

Now the site header will look good as follows:-

Finally, if you would like to hide the search button, you need to add the following codes inside style.css:-

.genesis-nav-menu .search-form input[type="submit"] {
display: none;
}
.search-form input[type="search"] {
width: 100%;
float: left;
}

The new looks will be cleaner.

For further fine tuning, you need to add the following code into style.css

/* Search Form
 --------------------------------------------- */
 .genesis-nav-menu .search-form input[type="submit"] {
     display: none;
 }
 .search-form input[type="search"] {
     width: 160px;
     float: left;
     font-size: 14px;
     padding: 10px 15px;
     background-color: #ddd;
 }