Changing Genesis Custom Header Size

The Genesis framework  for WordPress is highly customizable.

One popular customization you may want to make, is to change the header image size which means you’ll also need to edit the height.

By default the height is set at 100px and the width is 960px.

Most StudioPress themes, which are all built on the Genesis framework, offer design options that make it easy to add a custom header image.

The only problem is, they don’t all allow you to use an image which is more than 100px in height.

If you are using Genesis and have created your own custom child theme, you’ll need to do 2 things.

1. Add support for custom headers & change header height (in your child themes functions.php file)
2. Change the minimum height to match the height of your custom header image (in your child themes style.css file)

Once you’ve uploaded your custom header, you’ll need to make these changes to your child themes files.

Here’s a couple of screenshots which shows you exactly what they look like.

Child Themes Style.css File

Change the min-height: 100px to your header image height.

You’ll find at least 1-2 height properties under the Site Header section of your style.css file which need changing.

Child Themes Functions.php

Add support for custom header image and change the height to the same size as your custom image.

[notable]You may need to edit your style.css file to match the height change in your functions.php file.[/notable]

Changing Header Image Width & Height On Other Themes

Here’s a tutorial which will show you how to change the header image size using different themes for WordPress.