Changing Genesis Custom Header Size

9 Flares Twitter 2 Facebook 2 Google+ 1 LinkedIn 2 Pin It Share 2 StumbleUpon 0 Buffer 0 Buffer 9 Flares ×

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.

Header Minimum Height

Child Themes Functions.php

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

Custom Height

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

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.

9 Flares Twitter 2 Facebook 2 Google+ 1 LinkedIn 2 Pin It Share 2 StumbleUpon 0 Buffer 0 Buffer 9 Flares ×
Brad Dalton

Brad Dalton

WordPress Consultant 110+ Hrs/Week, traveler and lover of big surf, making new friends & my family. Read more about Brad Dalton or contact me if you need help with WordPress.
Brad Dalton

@wpsitesdotnet

Howdy! WP Sites creates daily tips & tutorials providing solutions for WordPress users.
Remove Comments From Specific Posts and Different Categories http://t.co/KhQwuWAlD3 - 15 hours ago
Brad Dalton

Never Miss The Latest Design Tips!

Speak Your Mind

*

Need A Solution for WordPress?

solutions for wordpress
WP Sites offers new posts & 900+ existing tutorials which include:

  1. 1. The basics on using WordPress to build & design a website
  2. 2. Tested PHP & CSS code snippets for easy customization of your theme
  3. 3. Tips, tricks & idea's on how to solve problems with WordPress

 
Enter your email address below & click "Get Updates!"