[Resolved] Add background image to hook area

Home Forums Support Add background image to hook area

  • This topic has 6 replies, 2 voices, and was last updated 10 months ago by David.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #1086517
    mikeb82

    I’m converting a website from an old theme to GeneratePress. Everything was going well until I encountered a roadblock. I need to add a fixed background image to the top right of the screen. I tried targeting the .site-header class with CSS without success. Is there a hook area between the body and the header I can use for this?

    Note: I also tried to add the image using elements by creating a div class with the background image. Only portions of the image were displayed.

    Thanks

    #1086779
    David
    Staff
    Customer Support

    Hi there,

    do you still have the old site so we can see what you’re trying to achieve?

    #1086808
    mikeb82

    Yes, it’s https://ccccccc.com

    It’s the falcon at the top right of the screen.

    #1086952
    David
    Staff
    Customer Support

    You can actually set multiple background images on an element like so:

    body {
        background-image: url('url-two-foreground-image'),url('url-two-background-image');
        background-repeat: no-repeat, no-repeat;
        background-attachment: fixed, fixed;
        background-position: right top, right top;
        background-size: auto, cover;
    }

    Make sure the Falcon image ( foreground ) is the first URL.

    #1087154
    mikeb82

    Thanks David,

    Your solution does exactly what I needed to do.

    Thanks again!

    Mike

    #1087158
    mikeb82

    Resolved

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