[Resolved] Add background image to hook area

[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

[David]

Hi there,

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

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

[mikeb82]

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

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

[David]

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.

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

[mikeb82]

Thanks David,

Your solution does exactly what I needed to do.

Thanks again!

Mike

[mikeb82]

Resolved

[David]

Glad to be of help

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

[Gerva]

Good morning
OK with CSS I can solve the problem …
But a curiosity, I am using thema from Broadcast library.
I set the Blog page as archive instead of having it in home.

Now I would like to have a background image underneath the different posts / the whole page.
Is there an Element/hook with Generatepress to do this?
Thanks

[David]

Hi there,

do you want to start a new topic, and share a link to the page where you want to apply the background image

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

[Gerva]

Excuse me …
Given the title I thought I’d latch onto the topic.
OK open new topic.
Thanks

[David]

No problems – its just this topic is quiet old, and if you open a new topic you get access to the private information field where you can share URLs etc.

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

[Author]

Posts