Genesis Tutorials

Genesis Full Width Header Image

This tutorial provides several solutions which enable you to add a full width header image in most genesis child themes.

Both solutions have been tested on the Genesis Sample child theme and the Smart Passive Income Pro child themes by StudioPress.

Here’s the result:


There’s 2 new solutions in this tutorial:

  1. The 1st solution involves modification of the child themes PHP code. Then you can simply add your image via Header Image field in the customizer.
  2. The 2nd solution enables you to add jQuery which might be needed depending on the image you choose for your themes site header. This solution also enables you to add a default ( fallback image ) from your child theme’s images folder. This image can be changed via the WordPress customizer.

There’s also a 3rd existing solution using CSS to achieve a full width responsive header.

Here’s the first 2 solutions for logged in members:

Leave a Reply

Your email address will not be published. Required fields are marked *