10Web Website Builder enables you to set a video as the background for Flexbox Containers or Sections, allowing you to create dynamic and visually compelling design options for hero headers and other page sections.
Adding a video background
To use a video as a background:
- Edit your page/website with 10Web Builder
- Click on a section or a container
- Go to the Style tab
- Look for Background settings
- Click on the Video icon
Setting up your video background
- Background type: Select the video icon to set the background type to video.
- Video link: Input the link to a YouTube, Vimeo, or .mp4 video.
- Start/End time: Define the video start and end times in seconds.
- Play once: Toggle on if you want the video to play only once.
- Play on mobile: Enable this to allow video playback on mobile devices, subject to device compatibility.
- Privacy mode: For YouTube videos, turn this on to activate privacy mode.
- Background fallback: Upload an image to display if the video fails to load.
Quick tip:
Utilize a Background Overlay to add a color filter or to darken your video, personalizing it to fit your design.
Troubleshooting common issues with autoplay:
- On iOS devices, background video autoplay may not work if the power-saving mode is active. Turn off the power-saving mode in your device settings.
- On Android devices, the Data Saver feature could prevent autoplay. Disable Data Saver to allow autoplay.
Note:
Autoplay functionality may also be influenced by Google's Autoplay policy for Chrome browsers.