Archived topic
Make a full screen cover image as background
3 replies · Started by Kelvin on December 7, 2021
Dear Sir/Madam,
How can I make a full-screen cover image including the header to my website? similar to this https://avada.theme-fusion.com/extreme-sports/ but I need to keep the menu bar when scrolling down and the background of this menu bar is another color.
Best regards,
Kelvin,.
Hi Kelvin,
This tutorial video should be helpful:
https://www.youtube.com/watch?v=TP8mgBQTgGg&t=4s&ab_channel=GeneratePress
Dear Ying,
Sorry, I watch the whole video but it doesn't explain how to make the background with full-screen size.
1. Set the page to full width in page editor > layout meta box > content container > full width:
https://docs.generatepress.com/article/layout-metabox-overview/
2. I would recommend install GenerateBlocks plugin which is also one of our product, add a container block, it should be full width by default:
https://docs.generateblocks.com/article/container-overview/
3. Add the background image to the container block:
https://docs.generateblocks.com/article/container-overview/#backgrounds
Let me know if you need further assistance :)