oliviaontheriviera

Hi Michael
can confirm all of the above are unchecked and no images in appearance=>customize in the child theme …

Just did the following steps:
Downloaded and copied the file in wordpad and named it header.php. Uploaded it to child theme. Inserted the `#headImage {
display: block;
float: none;
margin: 0 auto;
text-align: center;
width: 100%;
}`
in the style.css sheet in my child theme.
Everything is uploaded but it now looks like there are 2 images. I went to appearance=>customize and there is no header image set…

Michael i am putting the child theme “back on” so you can take a look and will follow the steps in your latest post and update you.

Sorry not sure what you mean?
Right now I have the parent theme active as I can’t get the header right on the child theme. I originally uploaded a header image in the wordpress interface=>appearance=>header.
The problem is that the heade rimage does not adapt to mobile layout and on a pc browser I also have white bits on either side (like if it were too short)…

Ive followed the steps above I must be doing something wrong?? It still looks off: the header image appears but there are still white bits on the sides and a big white blank below.
this is the code i copied in the header.php in the final step:

<div id="headImage">
<img src="https://www.oliviaontheriviera.com/wp-content/uploads/2014/06/oliviaontheriviera-header-180x1200.jpg" alt="oliviaontheriviera-header-180x1200.jpg" width="1200" height="180" class="alignnone size-full wp-image-26" />
</div>

Ive also noticed there is a custom header php file in the parent theme. could this be causing issues?

Hi Michael,
going to try the steps above. When you say
“If everything still looks the same make sure this css code is in the custom css file you are using.
#headImage {
display: block;
float: none;
margin: 0 auto;
text-align: center;
width: 100%;
}”
Do you mean I should check if this code is in the style.css file in my child theme? If that is the case it is not. Should I add it at the end after theme customization?

strange this does not seem to work on one page where comments still appear and I have followed the procedure above. Any ideas why that may be?
thanks

updating the header.hp file and style.css in the child theme with the new image and renaming the header so it was the same as the parent theme file completely messed up the layout. I’ve now removed both these files and activated the parent theme so the site looks normal…
??

now that ive renamed and uploaded the header.php file the layout is completely off now!

Hi Michael,
1.the active theme in my wordpress interface is the child theme not the parent theme, should i put the parent theme as the active theme?
2. the header.php file names were not the same, just changed that now

could this be causing the issue?

FYI I just changed my header image to one that is 180×1200 pixels as I rechecked in my theme and it now says that this is the suggested size. So it looks better now on a pc (less white bits on the side) however still not responsive on mobile devices

Hi Michael I’ve just check my child theme header.php again and the div code is definitely in there below the line <header id=”masthead” class=”site-header” role=”banner”>

With regards to the child theme, it is active on my site dashboard and I did follow the steps in the “how to create a child theme” section so am a bit lost really…

Thanks Esmi!! very helpful.

Hi Michael,
Just did the following:
1. copied the div above with my source image into a child header.php file below the line <header id=”masthead” class=”site-header” role=”banner”>
2. copied the div into the child style.css
Don’t see any difference on my website…
??

found the media queries in my main theme stylesheet , it has values in there for mobile devices,should i change these in the child theme style css?

[ Many lines of CSS moderated. please either post a link to the CSS directly or use pastebin.com and post that link her instead. ]