Put menu above header image

• 

  worthinggymnasticsclub · Member · Dec 21, 2016 at 4:55 pm

  • Copy link
  • Add topic to favorites

  I want to put the menu on top of the header image as its currently below it but i cant find the body script to swap the HTML – is this possible?

  The blog I need help with is: (visible only to logged in users)

• 

  staff-loquaciousloon · Staff · Dec 21, 2016 at 8:21 pm

  • Copy link

  Hi @worthinggymnasticsclub!

  Moving the menu to the top of the screen would require Premium Plan or Business Plan and a bit of Custom CSS.

  Once you have access to your site’s CSS, this snippet should do the trick:

  #site-navigation {
      position: absolute;
  	  top: 0;
  }
  
  .admin-bar #site-navigation {
  	top: 32px;
  }
  
  .site-header-image {
  	margin-top: 46px	
  }

  This isn’t ideal, because the theme is built to display the menu below the header, and we’re pulling it out of order to stick it at the top, then shifting the header image down.

  On some screen sizes, if your menu extends onto a second line, part of the header image might get covered up :)