This tutorial provides the solution which enables you to float your logo over the top of a background image in your header.
Both the logo & background images are added via the WordPress customizer.
Update : See this new tutorial : Logo Over Full Width Header Image
You can set a fallback for the background image which you can add to your child themes images folder.
Demo Video
As you can see in the video, all header elements display over the site headers background image including the widget(s) added to the header right widget area.
The site title & description will also display if no header image ( logo ) is added via the customizer.
The tutorial also provides very simple instructions and line numbers on how to change the CSS in your style.css file for the height of both your logo and the background header image so you can match these to your images.
The code is tested on the Genesis Sample child theme by StudioPress and may need modifying for use on other Genesis child themes.
The solution is also pre-installed in a modified copy of the Genesis Sample theme.
Here’s the download & instructions for members:
Leave a Reply