Site logo

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

Viewing posts 1–6 of 6

Hello!

So what I'm trying to do is something like on that site:

You see the page hero image
example1

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

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:

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.

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:
example

So even if I make a block, it will only show up there. What can I do then?

This archived topic is closed to new replies.