page header image show different picture

  • Author
    Posts
  • #3004103

    mayay2010
    Member

    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.

    #3004329

    kalijeeri
    Member

    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

    #3004339

    @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.

    #3004372

    onwardhouse
    Member

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

    #3004374

    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.

The topic ‘page header image show different picture’ is closed to new replies.