Here is how I solved the need for a header picture above the navbar in bootstrap
First step was to change the header.php file with a minor addition. (There is more than one way to do this but I like to keep css code with css etc). This is a cheap and dirty method but works for me on all test sites I have tried. I am refining it but needed a solution that was quick and easy.
1. In header.php add the following below the <body> tag and above the <div class="container"> tag. Comments are there only for my reference - you do not need them.
Code: Select all
<!-- header picture area -->
<div class="masthead">
</div>
<!-- end header picture area -->
Code: Select all
/* header css area */
.masthead{
height: 108px; /*adjust for your image size */
background-image: url(link to image location);
background-repeat: no-repeat;
background-color: #FCCC13; /* optional */
background-position: center; /* optional */
}
Code: Select all
.navbar-fixed-top {
/*top: 0;*/
z-index: 1030;
}
I am working on making it better and more responsive including adding code to allow the end user to change the logo from within the admin section by just selecting a new image and sizing. But that is future work and this works for now.
Any questions ask away. Any problems with this method ask away.
Alan