The community member is having difficulty creating a website with a background video on Webstudio, as it requires custom CSS. They have tried uploading the video to AWS and embedding it, but it is still challenging to style the background video. The comments suggest using a Vimeo embed, which can be positioned as a background video, and provide a video tutorial on how to do this. However, there is some confusion around whether the community member is talking about a self-hosted video or a third-party platform like Vimeo. The comments do not provide a definitive answer, but they offer suggestions and resources to help the community member achieve their desired background video effect.
Hi, I am coming from Webflow Ecosystem and most of my clients use Background Video on their header. That's why it was difficult for me to create a website on Webstudio. I did however used an easy hack to upload the video on AWS and add an embed on the home page but it is still really hard to style the background video on Webstudio since you have to write custom CSS for it.
Add your video embed (vimeo for now). Position it absolutely with a lower index than it's parent container and inset 0. The parent needs to be relative. This should take up the full size of the parent and you can add text/whatever on top.
The vimeo embed also has a background mode and autoplay.
Yeah! I was talking about a self hosted video that stays on the website instead of a 3rd party platform. Adding on Vimeo is fine and I haven't tried it yet but adding it like this would mean fetching it from Vimeo First before the website gets loaded. But nice know this feature exists. Thanks for that. I tried finding answers in Doc but for some reason it wasn't loading that day.