Assistance with Customizing Header in Lifestyle Pro

Community Forums Forums Design Tips and Tricks Assistance with Customizing Header in Lifestyle Pro

This topic is: not resolved

This topic contains 9 replies, has 4 voices, and was last updated by  bearnlioness 1 year, 4 months ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #81305


    Greetings forum members.

    I would sincerely appreciate some assistance in adjusting my header for my site

    I would like to change the color to match the background color.

    I would also like to reduce the height so there isn’t so much empty space.

    I’ve looked around in functions and the css, but I can’t quite seem to find where to change these fields. This might be because they need to be added, but admittedly I’m a bit of a novice with these things.

    I would sincerely appreciate help to adjust this area. All of the guides I have read walk me through dealing with the image, but not the size of the actual header space itself.

    Thanks so much!

    Patient, Nurse, and Technology Advocate at The Nerdy Nurse.

    • This topic was modified 1 year, 11 months ago by  thenerdynurse.
    • This topic was modified 1 year, 11 months ago by  thenerdynurse.


    It looks like you have the color figured out already. For the top and bottom padding, look for this:

    .site-header {
        background-color: #76D2C5;
        overflow: hidden;
        padding: 4.8rem;

    Then change the padding to this:

    padding: 2.8rem 4.8rem;

    This will eliminate some of that space.



    I use Lifestyle Pro on 2 sites
    Site one: This site started with Genesis/Lifestyle Pro. The default header is 920×150, which fills the full header. I had no cosmetic issues with this site at all.

    Site two: This is an older site that I had a different theme on. I switched the theme out this weekend, but for some reason it tells me the default header is 320×110 and crops images to that size. That’s way too small.

    This second site had all sorts of cosmetic issues and I’m fixing them, but this header size is a problem. Any suggestions on how to set the default image size to a full width?



    @catladykate, please provide a link to the second site with the issues. Troubleshooting will be difficult without it.



    Thank you. The problem site is The working site is



    What size is the header you wish to place on the new site? Is it that same one that’s 920 x 150? If so, go to Appearance > Functions and look for this:

    //* Add support for custom header
    add_theme_support( 'custom-header', array(
    	'header_image'    => '',
    	'header-selector' => '.site-title a',
    	'header-text'     => false,
    	'height'          => 110,
    	'width'           => 320,
    ) );

    Change the height and width to your header dimensions. Then go to Appearance > Header and upload the image. It will not resize an image that’s already in the library so upload a fresh copy.



    Wow, thank you so much for the fast and helpful response.



    Sure, let me know if this works for you.



    It took some updating with the min-height setting in the css file, but this did work. Thank you Anitac.



    We’ve been trying to upload a customized header that’s larger than the 920×150, tried changing the numbers in the way you suggestion in functions.php, but found it was still cropped. On the theory that there was a border width that was specified in the header, we tried changing numbers there, but still have the same problem. Can you help us figure out how to get our header to work? The site is



Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.