Archived topic
How can I make background image span the entire page?
6 replies · Started by Christopher on December 25, 2022
Hello, my background image on the homepage is only spanning about halfway. I would like to have it go the entire width of the screen. Is there a way to do it? Thanks.
Hi Christopher,
If it's a Page Hero, you can add that section through a Block Element - Page Hero instead. Doing so should make it full-width by default.
Alternatively, you can try setting the Container Block to full width through the toolbar settings: https://share.getcloudapp.com/rRu5jLqQ
Hi Fernando, I followed your steps to set the container block to full and still had no change for some reason. I created a new test page that has a lot less on it to just troubleshoot the container.
I have tried clearing the cache as well.
Hi there,
Would this "full width" section be in the middle of the page content or just the top of the page content below the header/navigation?
Let me know :)
It would be more to the top of the page content below the header/navigation. It is the first container on the page.
So a block element page hero (as Fernando mentioned) would likely be what you are looking for:
https://docs.generatepress.com/article/block-element-page-hero/
I reviewed the video, and have the page hero setup. The container background image is set to full width, but it is still cut off on my homepage. It only takes up about half of the width of the screen.