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”):
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:
- iframe style (Responsive idea/trick. Full docs her):
style="position: absolute; top: 0; left: 0;"
width="100%" height="100%"
- 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
- 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).
important
important
important``important
important
important
:
Iframe position set to absolute. Put this embed video inside a div with position relative.
More parameters:
rel=0
is used to disable related videos shown at the end of a video (Not relevant when a loop is true. But keep this in mind if you remove the loop).controls
- show/hide controls- More examples here:
http://leaderswest.com/2012/10/10/youtube-embed-options-can-make-your-videos-look-less-youtube-y/ - youtube_player_demo YouTube Player Demo | YouTube IFrame Player API | Google for Developers