Following the instructions at http://thepixelista.com/responsive-genesis-child-theme-logo/ I have replaced the background header (which appears slightly fuzzy/blurry due to it being a background image) with an actual “foreground” image.
First upload the image to the theme’s images file (rather than using the media upload)
This was done by removing the following code (in the functions.php file) (which came straight after the custom-background code):
//* Add support for custom header
add_theme_support( ‘custom-header’, array(
‘header_image’ => ”,
‘header-selector’ => ‘.site-title a’,
‘header-text’ => false,
‘height’ => 90,
‘width’ => 260,
) );
Also, go to Genesis theme settings and under ‘Header’ select ‘Image logo’ rather than ‘dynamic text’. (Remember to “save”). If this isn’t done, when you delete the original background image, the header will revert to text.
And adding to the css file, the following code: background: url(http://educationista.com/wp-content/themes/indexate/images/Educationista.jpg) no-repeat;
So, the entire block now looks like this:
.header-image .site-title a {
background: url(http://educationista.com/wp-content/themes/indexate/images/Educationista.jpg) no-repeat;
background-position: top !important;
float: left;
min-height: 90px;
width: 100%;
}
If the original background image is deleted, it reverts to text. Fix this by changing the Genesis theme settings, as above.
However, when the screen size goes below about 600 pixels in width, it reverts to the background image. Something to investivigate at a later date.
Leave a Reply