Streaming live at 10am (PST)

Loop Embed video on my website


#1

Link to website video is on home page

http://www.treesloungekauai.com

Code that I need to set up fop looping the embed video.


#2

You should use HTML embed.

Loop & Playlist

loop=1 (parameter). Specific for a loop youtube have a problem (You should use embed playlist).

Read her (Under “loop”):
https://developers.google.com/youtube/player_parameters

Full code

(Copy-Paste - only change the video ID twice).

<iframe  
style="position: absolute; top: 0; left: 0;" 
width="100%" height="100%"
frameborder="0" allowfullscreen
src="
https://www.youtube.com/embed/xv7iooFOnzg?autoplay=0&playlist=xv7iooFOnzg&loop=1&cc_load_policy=1&rel=0&controls=1&showinfo=0
" >      
</iframe>

docs:

  1. iframe style (Responsive idea/trick. Full docs her):
style="position: absolute; top: 0; left: 0;" 
width="100%" height="100%"
  1. youtube embed URL & parameters:
https://www.youtube.com/embed/xv7iooFOnzg?autoplay=0&playlist=xv7iooFOnzg&loop=1&cc_load_policy=1&rel=0&controls=1&showinfo=0

The src url start with youtube url - than ? and paramter1 (autoplay=0 in this example) - than for each extra parameter use “&” (The order do not matter). Read more about
parameters & Links

  1. Webflow designer. Now the video works fine (But you lose the “responsive” idea). So for 16:9 video (Most videos) - add padding bottom of 56.25%. Why 56.25%? (Answer her).

image

important important important``important important important:
Iframe position set to absolute. Put this embed video inside a div with position relative.
image

More parameters: