customizing header image and Menu bar on home

• 

  susanjanehildebrandt · Member · Apr 10, 2015 at 4:45 pm

  • Copy link
  • Add topic to favorites

  1. We are using Edin theme and cannot see how to edit the menu bar into one line. Can you help with that please.

  2. We would like know how to make the Featured Image AREA on the home page smaller. Thanks heaps Susan

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

• 

  alexjgustafson · Member · Apr 10, 2015 at 7:12 pm

  • Copy link

  Hi there!

  To make the menu stop breaking into two lines, we’ll need to decrease the font size. We can do this by adding some Custom CSS:

  .primary-navigation{
        	font-size: 54%;
  }

  You can play with moving that 54% up and down, but at 54% the menu stays in one line at all screen widths, until it gets hidden into a menu button on tablet-sized screens.

  2. We would like know how to make the Featured Image AREA on the home page smaller.

  This request is kind of tough, to be honest. Edin handles that area by using your featured image as a background, and with CSS we don’t really have a good option to modify that background.

  Most of the area actually exists as padding to make room for the background, so when we take away that padding to make it smaller it looks more like this:

  

  What I might recommend doing is making the area slightly smaller on the desktop version with this CSS:

  @media screen and (min-width: 1020px){
  div.hero.with-featured-image{
  padding-top: 40px;
  padding-bottom: 40px;
  }
  }

  And then try adding that image into the body of the home page instead of as the featured image. To give you options of resizing the image.

  -Alex G.