Simple Fix: Moving Twenty Twelve Menu to below the Header Image

I know this is an old theme and there are a bunch of convoluted “fixes” for this issue. I’m posting it to save other people lots of wasted time when there is such an EASY and QUICK FIX.

THE SIMPLEST FIX that worked like a charm is HERE.

WORK IN YOUR CHILD THEME (there are even plugins to make that simple, too!).

~~~~~~~~~~

Download and open the header.php file from the Twenty Twelve theme, /wp-content/themes/twentytwelve.

Around line 42 you will see the below code.

<nav id="site-navigation" role="navigation">
<h3><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
<a href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a>
 <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
 </nav><!-- #site-navigation -->

 <?php $header_image = get_header_image();
 if ( ! empty( $header_image ) ) : ?>
 <a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php echo esc_url( $header_image ); ?>" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
 <?php endif; ?>
 </header>

For moving twenty twelve menu all you do is swap them and place the site navigation (menu) below the header image as below.

<?php $header_image = get_header_image();
 if ( ! empty( $header_image ) ) : ?>
 <a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php echo esc_url( $header_image ); ?>" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
 <?php endif; ?>

 <nav id="site-navigation" role="navigation">
 <h3><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
 <a href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a>
 <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
 </nav><!-- #site-navigation -->

Now upload the header.php to your child theme and you should have a new position for the Twenty Twelve menu.

~~~~~~~~~~~~~~~~~