Lista de videos de Youtube con html

LISTA DE REPRODUCCION DE VIDEOS DE YOUTUBE  CON HTML PARA TU PAGINA WEB

(Sin necesidad de tener tu cuenta propia en youtube)

 

 Puedes agregar cuantos videos quieras a la lista, tienen un diseño moderno que quedará perfecto y

llamará la atencion de todos tus visitantes. Para tenerlo en tu web sigue los siguientes pasos:

 

PASO 1.-  Copia todo el codigo html y pegalo en el BODY de tu pagina, ( en jimdo inicias secion - vas a AÑADIR MÓDULO y das donde dice WIDGET/HTML y pegas todo y das GUARDAR los cambios.)

 

PASO 2.-  IMPORTANTE le das like a esta pagina si no, no funciona.

 

PASO 3.- Ignora el paso 2 Eso es para entretenerlos porque solo necesitas un solo paso :D.

 

    Para agregar un video vas youtube, buscas el que te guste  y los reproduces despues te vas a la dirección del video es así:

 

https://www.youtube.com/watch?v=8PTDv_szmL0

 

 Del cual solo necesitas la ID del video que esta marcado en rojo en todos los videos es lo mismo esa ID la vas a llevar al codigo html que dejó abajo que igualmente dejé marcado en rojo para que identifique con facilidad donde debe estar y con azul el nombre del video este comando &autoplay=1  es para que el video comience a reproducir automaticamente si no deseas que asi suceda solo lo borras. El primer link es el que se verá siempre al abrir la pagina.

 

 

 

 

<div id="bg-playlist-n" style=

"background-image: url(http://u.jimdo.com/www17/o/s224fc11c65cbc592/img/i9e1c3da81b40d6dd/1375646740/std/bg-play-list-2.png); height: 311px; width: 520px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; position: relative; padding-top: 9px; background-repeat: no-repeat;">

<div class="wrap" style="height: 280px; width: 500px; background-color: rgba(58, 58, 58, 0.36); margin-top: 0px; margin-right: auto; margin-left: auto; margin-bottom: 0px;">

 

<iframe  allowfullscreen="" name="video" src="http://www.youtube.com/embed/8PTDv_szmL0?feature=player_detailpage&amp;autoplay=1" frameborder="0" width="500" scrolling="no" height="280" id="video" ></iframe>

</div>

</div>

 

<center>

<select name="name" onchange="video.location.href=this.options[this.selectedIndex].value">

<option value="http://www.youtube.com/embed/8PTDv_szmL0?feature=player_detailpage&amp;autoplay=1">

B.o.B - Nothin On You

</option>

<option value="http://www.youtube.com/embed/UHQt1eTOWEo?feature=player_detailpage&amp;autoplay=1">

YO NO VOTE POR TÍ - Akil Ammar

</option>

<option value="http://www.youtube.com/embed/NB9IW4LAngU?feature=player_detailpage&amp;autoplay=1">

Cree y Atrevete - Tinkerbell

</option>

</select>

</center>

 

 

 

 

nota: no se deben manipular las medidas ya que saldría de cuadro el video

 

 

   

 

 

 

Comentarios: 1
  • #1

    SERGIO (jueves, 17 agosto 2017 23:22)

    GRACIAS PERO QUIERO SAVER SI SEPUEDE REPRODUCIR VIDEO DESDE MY PC