Adding Background Videos

Docs Image Galleries & Animations
1

You can easily add a responsive background video to a section/container of your page. It will auto scale to fill the available space and looks nice on any device.

First, select the container you want to add background video to:

Screenshot_1
Screenshot_1.jpg1558×943 412 KB

Then click the Make Background Video button:

Screenshot_2
Screenshot_2.jpg1558×943 268 KB

Click the little folder icon to browse to your video and select it:

Screenshot_3
Screenshot_3.jpg1558×943 306 KB

You can see the background video added to our page header. The video will auto play and loop:

Screenshot_4
Screenshot_4.jpg1558×943 600 KB

You can preview it directly in Wappler design view:

bgvideo
bgvideo.gif1147×737 2.69 MB

3 Likes
2

A nice resource for all of you to check: https://coverr.co/
They offer free stock videos, which can be used with the Background Video component :slight_smile:

8 Likes
71

This is awesome, thanks! I could really use this :grin:

100

How to make a video with sound ?
Muted as default but with unmute button and pause button like on https://www.littlepalmisland.com/ ?

141

You can't

Web standards prohibit videos starting unmuted.