Site logo

Archived topic

Add background image to hook area

10 replies · Started by mikeb82 on November 30, 2019

Viewing posts 1–11 of 11

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

Hi there,

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

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.

Thanks David,

Your solution does exactly what I needed to do.

Thanks again!

Mike

Resolved

Glad to be of help

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

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

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

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.

This archived topic is closed to new replies.