Support » Theme: pinpress » move header above menu in pinpress theme?

Viewing 6 replies - 1 through 6 (of 6 total)
  • I would also like to know how to do this. I’m developing a site for a client who would like the banner image to appear above the menu bar. Thanks!

    I’m having the same problem. When I upload a header image at 960×250 it appears below the menu bar. Love the look of this theme but need to get the header in the proper location.

    Thanks

    Theme Author ezhil

    (@ezhil)

    put this piece of code above <nav> in header

    [ Moderator note: please wrap code in backticks or use the code button. ]

    <?php $header_image = get_header_image();
    		if ( ! empty( $header_image ) ) : ?>
    			<a>"><img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
    		<?php endif; ?>
    Moderator Jan Dembowski

    (@jdembowski)

    Forum Moderator and Brute Squad

    put this piece of code above <nav> in header

    After you’ve created and activated a child theme. 😉

    http://codex.wordpress.org/Child_Themes

    If you modify the parent theme’s header.php file then you will lose those modifications when the theme is updated.

    Thanks, and good luck to Laurie and dframe! I’ll come back with my own results when I’ve completed the child theme/header/php revisions.

    Ok, so I found the code given to us to insert just above the <nav> tag was a little buggy – the link to Home was not working, there was a tiny “> showing at the bottom left corner of the image, and it added a new header above the menu but did not remove the old one below the menu bar. So, having this code to work from I was able to figure out what the existing code was for the header, and I copied the corresponding code from the original header position into the spot just above <nav> as directed (of course replacing the code given to us here.) I did this in the WordPress Editor, then copied the entire code from the header.php page and pasted it into a text file, named it header.php, uploaded that to my child theme directory and it all worked fine! Hopefully it will indeed “stick” after the next update to the them, but I saved a copy of the working code on my local machine just in case.

    Here are the lines I modified…scroll down in header.php till you see the </hgroup> closing tag…in mine there was an empty line beneath that and the <nav id> opening tag where I plopped the code we’ve been given…
    Started with:

    </hgroup>
    
    		<nav id="site-navigation" class="main-navigation" role="navigation">
    			<h3 class="menu-toggle"><?php _e( 'Menu', 'pin' ); ?></h3>
    			<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'pin' ); ?>"><?php _e( 'Skip to content', 'pin' ); ?></a>
    			<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
    		</nav><!-- #site-navigation -->
     <div class="searchform_headercover"><?php get_search_form(); ?></div>
    <?php $header_image = get_header_image();
    		if ( ! empty( $header_image ) ) : ?>
    			<a>"><img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
    		<?php endif; ?>
    	</header>

    After adding the code just as instructed, but getting double headers and errors in the one that’s above the menu:

    </hgroup>
                   <?php $header_image = get_header_image();
    		if ( ! empty( $header_image ) ) : ?>
    			<a>"><img src="<?php echo esc_url( $header_image ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
    		<?php endif; ?>
    		<nav id="site-navigation" class="main-navigation" role="navigation">
    			<h3 class="menu-toggle"><?php _e( 'Menu', 'pin' ); ?></h3>
    			<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'pin' ); ?>"><?php _e( 'Skip to content', 'pin' ); ?></a>
    			<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
    		</nav><!-- #site-navigation -->
     <div class="searchform_headercover"><?php get_search_form(); ?></div>
    <?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 ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
    		<?php endif; ?>
    	</header>

    Final result that worked for me:

    </hgroup>
    		<?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 ); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" /></a>
    		<?php endif; ?>
    		<nav id="site-navigation" class="main-navigation" role="navigation">
    			<h3 class="menu-toggle"><?php _e( 'Menu', 'pin' ); ?></h3>
    			<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'pin' ); ?>"><?php _e( 'Skip to content', 'pin' ); ?></a>
    			<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
    		</nav><!-- #site-navigation -->
     <div class="searchform_headercover"><?php get_search_form(); ?></div>
    	</header>

    I hope this helps anyone else who’s trying to get the same result. Thanks to ezhil and Jan Dembowski for responding!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘move header above menu in pinpress theme?’ is closed to new replies.