Youtube embebido en blog de WordPress

Para que los videos en mi blog fuesen "responsive" o adaptables recurria a un pluging, que agregaba una popup y hacia el trabajo, luego me inundaba con sugerencias de pasarme a PRO para seguir usandolo.



El metodo de insertar videos en Wordpress es extremadamente facil, solo unas lineas de codigo y eres dueño del proceso, sin deberle a nadie.

Primero agrega este codigo a tu hoja de estilo, buscala en wp-content/themes si has cambiado el tema

.contenedor-video {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}

.contenedor-video iframe,
.contenedor-video object,
.contenedor-video embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


Lo siguiente que haremos será copiar el código para embeber el vídeo, igual que hemos hecho otras veces, aunque para indicarle que el div será responsive, hemos de editar nuestro blog en formato texto (no visual) para añadir el HTML necesario, en este caso un div que contendrá el vídeo:





<div class="contenedor-video">
<iframe width="560" height="315" src="//www.youtube.com/embed/lWA2pjMjpBs?rel=0" frameborder="0" allowfullscreen></iframe>
</div>





Aqui puedes cambiar el ancho o altura de tu video.

<iframe width="560" height="315" src="//www.youtube.com/embed/lWA2pjMjpBs?rel=0" frameborder="0" allowfullscreen></iframe>

En tu blog Wordpress se vera asi:



Y con esto ya está listo, la próxima vez que queramos hacer que un vídeo sea adaptable, sólo tendras que añadir el codigo “contenedor-video” para que funcione.


..