Youtube embedded with LOOP

To create Youtube embedded code with LOOP, add "?loop=1&playlist=ZWQGZxpm9mE" after the url, as shown below

playlist=ZWQGZxpm9mE is the ID of the video

<iframe width="560" height="315" src="https://www.youtube.com/embed/ZWQGZxpm9mE?loop=1&playlist=ZWQGZxpm9mE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

To make your Youtube video as responsive use below HMTL & CSS.

CSS

.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

HTML

&lt;div class=&quot;videoWrapper&quot;&gt;
&lt;iframe width=&quot;100%&quot; height=&quot;425&quot; src=&quot;https://www.youtube.com/embed/U-Vs550CRc4?autoplay=1&amp;showinfo=0&amp;loop=1&amp;list=PLyU5X-W7kMhMj9oBTnP58QS7bV9AVkZu4&amp;rel=0&quot; frameborder=&quot;0&quot; allowfullscreen&gt;&lt;/iframe&gt;
&lt;/div&gt;
Copyright © 2024 Siam Naulak.
magnifiercrossmenu