How to change the header image for each inside page?

Hi,

I’d like to change the header image of the inside pages to the ones I want.
Currently it is set to one default image. I am not able to change that either unless I go and physically replace that image through the control panel or FTP.

Please let me know how to go about doing this. I have tried using the “Featured image” option available on the respective page. But that doesn’t work.

Thanks
Sandesh

Hi,

Please post a link to your website, to the page where you want to change the image, so I can check how that can be done.

Best Regards,
Csaba

Hi Csaba,
Here is a link to a page on my site. "http://emes.c4business.com.au/advisory"
Infact I want to know even if I create a new page tomorrow how will I change the image of that boy with glasses and writing ona book. Every new page I create come with that image by default.
Also another issue I need help with is how to add Bookmark anchors with smooth scrolling to a section in a single page.

Hi,

On that page you can change the header image using this Custom CSS:

.page-id-18 .header-image {
    background-image: url(your-img-url-here) !important;
}

You can apply this for other pages too, by duplicating the above Custom CSS and replace 18 with the ID of the page, so in this example the page you have posted the link to have the ID as 18, so the class for that page is “.page-id-18”.

Please add the above CSS to your Child Theme’s style.css or in case you haven’t setup a Child Theme already, then you can also use this plugin to add the CSS to it: https://wordpress.org/plugins/simple-custom-css/ so you will not loose the changes on theme updates.

Please let me know how it works.

Best Regards,
Csaba

Thank you Csaba for that. I have added the CSS. However it doesn’t seem to work.

I have given the absolute path “http://emes.c4business.com.au/wp-content/uploads/2016/09/bigstock-Perth-Skyline-Reflected-In-The-93909215.jpg

But if I use absolute Path then when I change the server to the client’s server I will have to change again for all of them.

Also please tell me what relative path to use?

Thanks for your help

Sandesh

Sorry It is working now with the Absolute path. But I would like to know if I can use a relative path. And if so what should it be.

Thanks again

Hi,

If you change your server it won’t work even with a relative path, because the image must be in a link and in a folder, so adding just /image-name.jpg won’t work, because the link is more complex if you see, so please do this modification only after you have changed the server if you don’t want to do it twice.

Best Regards,
Csaba

hi,
this code is workin only in desktop mode, in mobile the custom image is replaced by default header…
any suggestions how to fix that?

thanks.