Archived topic
Add background image to hook area
10 replies · Started by mikeb82 on November 30, 2019
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?
Yes, it's https://ccccccc.com
It's the falcon at the top right of the screen.
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.