Need help? Check out our Support site, then


page header image show different picture

  1. Hi,
    The ovation theme shows header image on every page.
    I want each page to have header image in a different picture.
    Please help me with the CSS for this. thank you!

    The blog I need help with is dom2c.com.

  2. CSS won't help you with this if your theme doesn't provide you required feature. Either look into theme options of try using another theme

  3. @mayay2010, we can do this with custom CSS. Each page has a unique page id CSS class set in the opening body html tag and we can use that to hide the existing image and insert another one. You can use the web inspector built into your browser to find the page id CSS class. In the following example, I've used this page from your site, https://dom2c.com/%e9%9b%bb%e8%a6%96%e5%92%96/, and randomly pulled an image out of your media library.

    .page-id-272 .wp-custom-header img {
      visibility: hidden;
    }
    .page-id-272 .wp-custom-header {
      background: url('https://example77285.files.wordpress.com/2017/07/p4-1.jpg') no-repeat scroll top center / cover;
    }

    You can use the above as a guide in creating the CSS rules to replace the header image on other pages.

  4. Is there CSS that can also hide the header on all pages?

  5. Hi @onwardhouse, since you are using a different theme (Maisha), and since CSS is generally theme specific, can I ask you to create a new thread in the CSS Forum? Many thanks in advance.

You must log in to post.

About this Topic