Archived topic
Pagehero: An image with the container width, and under it a color full width.How
5 replies · Started by Pavel on August 16, 2020
Hello!
So what I'm trying to do is something like on that site:
You see the page hero image

And when you zoom the page out, it stays on it's place, but behind it you see the background color

So how do I do it?
Thank you.
Hi there,
the image would have to be part of the hero content, and it would need a transparent background. Then you can add a background color to the header element.
However, if its a one off header element and all that content is static. Then i would probably NOT use a header element. Instead use the Block Editor and GenerateBlocks to create that layout in the post editor:
Can be achieved with a Container Block which you can make Full Width, and have the blue background. Within that a 2 column Grid for text / image layout.
Thanks a lot!
You're welcome
Can't understand how to do anything with generateblocks at all yet, but maybe I need some time.
I have another question. When I change a page, the only thing that changes on my site is this area:

So even if I make a block, it will only show up there. What can I do then?
Try using the Block Element:
https://docs.generatepress.com/article/block-element-overview/