[Resolved] Header Image

Home Forums Support Header Image

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1429614
    John

    Hi,

    On logged-out pages, I’d like to have a header image, instead of a band of color.

    I found the following code at this post that pointed me in this direction.

    .site-header {
      background: url("http://your-image-path.jpg") no-repeat center; 
    }

    This works, except that the header image then only shows on the front page, not on other pages that are on the logged-out side of the site. I tried the following but the logged-out header still only appeared on the front page.

    body.logged-out.site-header {
      background: url("http://your-image-path.jpg") no-repeat center; 
    }

    What needs to be changed so that the header image appears on all logged out pages?

    Thanks!

    #1429632
    John

    I also looked into using the Customizer > Background Images > Header but I didn’t see how I could control the image appearing in a logged-out state and not the logged-in state.

    #1429663
    Leo
    Staff
    Customer Support

    Hi there,

    Try uploading the logged out image in the customizer, then use this CSS for the logged in users:

    body.logged-in  .site-header {
        background: url("http://your-image-path.jpg") no-repeat center; 
    }
    #1430978
    John

    That worked perfectly. Thanks, Leo.

    ====================

    For my future reference…

    body.logged-in .site-header{
    background: url(“http://www.image-path.jpg”) no-repeat center;
    }

    body.logged-in .site-info{
    background-color: #fac8b4;
    }

    body.logged-in .main-navigation, .main-navigation ul ul,
    body.logged-in .main-navigation .menu-toggle{
    background-color: #fac8b4;
    }

    body.logged-in .main-navigation .main-nav ul li a {
    background-color: #fac8b4;
    }

    body.logged-in .main-navigation .main-nav ul li a:active {
    background-color: #fac8b4;
    }

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