• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2552

Original Genesis Tutorials & 6000+ Guaranteed Code

Snippets

  • Support
  • Newsletter
  • Register
  • Videos
  • Log in

Full Width Header Image With Header Right Widget Content Over Image

Generally, you would use the built in custom header function when adding a image to your header.

The only problem is, when you use the custom header function coded into your child themes functions file, to add a full width header, your header right widget area no longer works.

To get around around this, you can use CSS to add your header image instead.

In this tutorial, i’ll provide the step by step instructions and CSS which results in something like this example:

full width image

As you can see in the above screenshot, the image extends full width of the site header, not full width of the screen.

The CSS in this tutorial is tested on the Magazine Pro child theme by StudioPress and may need modifying for use on other themes.

Register for full access

Primary Sidebar

How it works :

I write tutorials for you which include the custom code you need for a flat $49.99 fee. You get 1 tutorial request as well as access to all 2500+ existing tutorials for 1 month.

  • Premium Members Only
  • Sign Up
  • Support