To add an image background to your Woorise landing page, you can use the Cover or Group block. The Cover block allows you to overlay text and other elements on top of an image with customizable opacity, while the Group block helps structure multiple blocks with a background image.
In this example, we use the Cover block to add an image background. In the same way you can add a video background.
- If you’re adding a new Cover block, you’ll be prompted to choose an image or a background color during the setup process.
- If you’re editing an existing Cover block, such as one from a template, simply select the block and click the Replace button in the toolbar to change the background image.
In the Settings tab, you will find options to further refine your background image:
- Fixed Background – Enables a parallax effect where the background image stays in place as users scroll.
- Repeated Background – Tiles the background image to fill the entire area if the image is smaller than the block. This is a great option for creating a seamless texture or pattern effect.
- Focal Point – Adjusts the position of the background image to ensure the most important part remains visible.
In the Styles tab, you’ll find several options to further customize your background:
- Overlay Color & Opacity – Add a color overlay to enhance readability and adjust its opacity for the perfect balance.
- Padding & Margin – Control spacing around your content to improve layout and design.
- Minimum Height – Set it to 100vh to create a full-page background that covers the entire viewport.
The Cover block is great for adding a background image with overlaid text or elements, but keep in mind that background images may crop or shift on different screens. If you need an image to remain fully visible and responsive across all devices especially if contain text, use the Image block instead, as it maintains the image’s proportions without cropping.