Book Lite Theme – Reduce Header Image Size

• 

  sijutoday · Member · Jul 20, 2017 at 9:14 pm

  • Copy link
  • Add topic to favorites

  Using Book Lite Theme – https://wordpress.com/theme/book-lite/
  It’s nicely designed one. 2 issues:

  1. The header image is big (500px) and fills up entire screen on mobile devices – most people miss out the content below it. I see below style defintion in use. Is there anyway to reduce the size. Making it 300 will be ideal for me. How can I do that?

  2. Is it possible to make the top menu sticky?

  Thank you for any guidance.

  #masthead {
  			background: url( cropped-dsc_00001.jpg ) center 0 no-repeat;
  			margin-top: 0;
  			padding-bottom: 0;
  			max-width: 100%;
  			height: 500px;
  			position: relative;
  			background-attachment: fixed;
  		}
  		.admin-bar #masthead {
  			background-position: center 28px;
  		}

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

• 

  garysixtyeight · Member · Jul 20, 2017 at 11:54 pm

  • Copy link

  Hi @sijutoday,

  For the sticky menu, please by adding the CSS below to your site in My Sites > Customize > CSS.

  .main-navigation {
      position: fixed;
      z-index: 1;
  }

  https://en.support.wordpress.com/custom-design/editing-css/

  Adding CSS is a feature of the Premium and Business plans.

  For the header image, would you like to change the height to 300px for all screens or just mobile devices?

• 

  sijutoday · Member · Jul 21, 2017 at 1:29 am

  • Copy link

  Thank you @garysixtyeight for the response.

  I dont see CSS, guess that because “Adding CSS is a feature of the Premium and Business plans.”

  #height of header image -> I would prefer all screens. At a minimum on mobile.

• 

  garysixtyeight · Member · Jul 21, 2017 at 1:57 am

  • Copy link

  I dont see CSS, guess that because “Adding CSS is a feature of the Premium and Business plans.”

  That’s correct, an upgrade Business or Premium plan would be required to add custom CSS.

  If you decide to upgrade, please let me know, and I can post the CSS for the header.

• 

  sijutoday · Member · Jul 21, 2017 at 2:08 am

  • Copy link

  Sure, @garysixtyeight. Thanks again

• 

  garysixtyeight · Member · Jul 21, 2017 at 2:17 am

  • Copy link

  You’re welcome :)