Get image into site-header area

Hello angeladesign,

It is very possible to do what you are looking for. In fact, the placement you have currently is perfect. The next step is at add custom CSS to finish the positioning and placement of the image. You will likely need to use position:absolute;top:0 to move the custom header to the top of the page. Then you will need to manipulate the z-index on the header so it goes behind the logo. Then the rest of configuring background colors, header sizing and whatnot.

So yes, it is absolutely feasible, but will take a bit of CSS configuration.

Nick

Thanks for your help!

Unfortunately, I didn’t realize that you can’t add a global image to the blog/post archive/categories and 404 pages: https://buildings.techmatemn.com/structurally-speaking this makes the plugin kinda a deal breaker ?? Unless I’m missing something or you have a quick solution…

Thanks. Angela

Hi Angela,

You are correct, however this is one of the most common requests that I have heard. I am actually releasing a new plugin soon which will do all of this and much more. The plugin will be released in the www.remarpro.com repository and will also have a premium version. I hope to have that released by the end of the month, as I am just finalizing a few things and writing up documentation. I will post here once it is up in case you are interested in checking it out. Quite honestly, it is a 100 times better than this plugin.

All the best,
Nick

Here is my workaround; it may not be pretty, so if you have any suggestions — do share. Add this to your functions php file:

//* ADD HEADER AREA TO BLOG & SINGLE POST PAGES
add_filter('genesis_after_header','Blog_Header_Area');
function Blog_Header_Area(){ ?>

<div class="gch-header-blog">
</div>

<?php }

Add this to your css:

.blog .site-header {
    background-color: rgba(255, 255, 255, 0.6);
    min-height: 100px;
    position: absolute;
    width: 100%;
}

.blog .gch-header-blog {
	min-height:400px;
}

.blog .gch-header-blog {
background: url(images/Structural-Buildings-Steel-Frame_Construction-Header-2.jpg) no-repeat left;

}

Repeat for .single-post and .archive pages. Thanks. Angela