Create a section with a background image

Create a content section with a background image with the following steps:

  1. Drag a widget to the page. If you don’t want to display anything on the background, you can choose the Spacer widget for empty space.
  2. Right click on the section and choose Edit Section.
  3. In the left panel under the tab Content you can optionally set a minimum height for the section under Height.
  4. Click on the Style tab and behind Background Type click on the first icon (classic).
  5. Click on the grey box below Image.
  6. Choose an image from the Media Library or upload an image from your computer.
  7. At Position you can choose from which position the background needs to be aligned. Choose for example Center Center to align the image in the middle.
  8. At Repeat choose no-repeat and at Size choose Cover to let the image not repeat itself, but cover the whole section.
  9. Optionally you can set the Position to Custom to manually determine the positioning of the background image. When you choose for custom positioning, make sure you select positioning by percentage to make it responsive.
  10. Optionally you can add a background overlay color under Background Overlay.
  11. To add a background overlay, click on the first icon behind Background type (classic).
  12. Choose a color and at Opacity you can change the opacity of the overlay.

You now have a section with a background image.



Share this Webpresso® Doc: