Assistance with Customizing Header in Lifestyle Pro

[thenerdynurse]

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.

http://thenerdynurse.com/

[AnitaC]

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.

---

Need help with customization or troubleshooting? Reach out to me.

[catladykate]

I use Lifestyle Pro on 2 sites
Site one: This site started with Genesis/Lifestyle Pro. The default header is 920x150, 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 320x110 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?

[AnitaC]

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

---

Need help with customization or troubleshooting? Reach out to me.

[catladykate]

Thank you. The problem site is http://www.DepressionElegantGlass.com. The working site is http://www.MoreBooksThanTime.com

[AnitaC]

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.

---

Need help with customization or troubleshooting? Reach out to me.

[catladykate]

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

[AnitaC]

Sure, let me know if this works for you.

---

Need help with customization or troubleshooting? Reach out to me.

[catladykate]

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

[bearnlioness]

We've been trying to upload a customized header that's larger than the 920x150, 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 http://www.romanticalchemy.com.

Thanks!

bearnlioness

[Author]

Posts