Streaming live at 10am (PST)

Youtube Video - Looping and hiding options/play button

I have a bit of an issue with my background video.

When I was using the “video” option, I could only have a small video.

Now that I am using the youtube option, I can have whatever length video but it doesnt continue playing. Also have the issue of seeing the youtube items (Youtube logo, Play Button and Video Name).

Is there anyway to fix this?

Thanks

Alex

https://preview.webflow.com/preview/think-audio-visual?utm_medium=preview_link&utm_source=designer&utm_content=think-audio-visual&preview=1d874a9fda0716feb573256119100f21&mode=preview

That is not a background video element. It is a video embed. Youtube branding is usually on Youtube videos. You can explore the Youtube API to see options, or choose an alternative like Vimeo that has professional features like removing branding. You will need to use embeds to use advanced display features, not available in the video element.

Hi there, thanks for the info. I am really new to web design so still learning. I will give this a go and see how I get on. Thanks again!

Hi all, I’ve been trying to get this to work myself and getting very confused by all the posts (most I couldn’t understand so couldn’t get to work). Thought this might be of use for you all reading this.

You can develop your video specs using Google Video Player Developer link below ([https://developers.google.com/youtube/youtube_player_demo]

Just paste in your youtube web link in and then turn off and on options of what you want (e.g loop, modest branding etc) and this automatically generates code that your can paste in Webflow html embed box. However, please note for the looping to work you have to set-up a playlist in Youtube (even if it’s just the one video) and then use the playlist ID dropdown menu. You do however still get a flicker of youtube branding when it starts to loop each time.

To get your video responsive, change your height and width both to 100% in the code, then give video Class and use 56.25% bottom padding (16:9 ratio), change height to 0 px and change position to relative (see screenshot attached).