[Resolved] How to manage the visibility of the header background-image for different pages

Home Forums Support How to manage the visibility of the header background-image for different pages

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1367483
    Hans-Hermann Loewer

    Hi Tom and team,

    in the customizer under -> backgroundimages -> header-area
    one can choose a picture and its reply-rate, position etc.

    How can I stop showing that picture for special pages via CSS?

    AND/OR:

    Is it possible to give each sub-page an individual backgroundimage for that header area?
    (NOT the Logo image! of the header)

    Thanks in advance!

    Hermann

    #1367545
    David
    Staff
    Customer Support

    Hi there,

    could you use a merged Header Element to create the style you’re looking for?

    https://docs.generatepress.com/article/header-element-overview/

    #1368589
    Hans-Hermann Loewer

    Hi David,

    no, I can´t. I want to have the header I have, but change the background-image in a subpage.

    What is the right CSS-address for the background image in the header area?

    Is it possible, if I use the page-id to say “display: no” for that image in that page and to show it in another with the same header-elements?

    Thanks in advance!

    Hermann

    #1368773
    Leo
    Staff
    Customer Support

    To remove the site header background image on a specific page, you’d do something like this:

    body.page-id-xxxx .site-header {
        background-image: none;
    }

    To add a specific site header background image on a specific page, this would be it:

    body.page-id-xxxx .site-header {
        background-image: url(URL-HERE)
    }

    Just place xxxx with the actual ID of the page.

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #1369041
    Hans-Hermann Loewer

    Thank you, Leo!

    Hermann

    #1369821
    Leo
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.