[Support request] Pagehero: An image with the container width, and under it a color full width.How

[Pavel]

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.

[David]

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:

https://generateblocks.com

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.

[Pavel]

Thanks a lot!

[David]

You’re welcome

[Pavel]

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?

[David]

Try using the Block Element:

https://docs.generatepress.com/article/block-element-overview/

[Author]

Posts