Imágenes de Youtube en el blog

En muchas ocasiones para un articulo necesitamos ua buena imagen que no aparece, sin embargo si existe un buen video de Youtube. Si ponemos el video, generalmente lo ponemos para que no salga en portada y asi no se ralentiza el blog.

Si queremos poner la imagen que Youtube tiene del vídeo podemos tenerla siempre y sobre todo como imagen sin la gráfica y textos de Youtube. Esto es lo que explicamos en esta entrada. Youtube siempre genera 4 imagenes y una de ellas grande con entre 300 y 480 pixels según la calidad del video. Esto también es útil para los que no disponen de flash y para dispositivos móviles.

Obtener la ruta de las Imágenes

Las imágenes de los vídeos de Youtube utilizan siempre el mismo identificador que un video, o sea los 11 caracteres con los cuales podemos tener nuestra imagen [http://www.youtube.com/watch?v=9040cRk6nOo]. El identificador del vídeo lo representamos como IDVideo en nuestros ejemplos.
La imagen utilizada por defecto utilizada por Youtube es:
http://img.youtube.com/vi/IDVideo/default.jpg. Esta es una imagen pequeña de 120 x 90 pixels. Para imagen de portada de una entrada sin embargo es muy interesante la imagen …/0.jpg que tambien genera y almacena Youtube, pero de 480 x 360 pixels y de alta resolucion. Existen otras dos imagenes distintas del video tambien.

Este es el codigo que debemos incluir en una entrada para que aparezca una imagen de Youtube, siempre en el modo html:
Imagen 0: [480 x 360 pixel, alta res]
http://img.youtube.com/vi/ID/0.jpg
Imagen 1: [120 x 90 pixels, baja res]
http://img.youtube.com/vi/ID/1.jpg
Imagen 2: [120 x 90 pixels, baja res]
http://img.youtube.com/vi/ID/2.jpg
Imagen 3: [120 x 90 pixels, baja res. Igual a la imagen 0]
http://img.youtube.com/vi/ID/3.jpg

Poner las imágenes de Forma Manual

Lo primero que se necesita es el identificador del video, para ello nos fijamos en el URL del vídeo que deseamos e identificamos el parámetro GET con nombre v.

En el URL de ejemplo tendríamos el identificador del video: 9040cRk6nOo. Luego de ello si deseamos mostrar la imágen por defecto tendríamos:

Poner las Imágenes con PHP

Lo que necesitamos en este caso es crear una función que devuelva el identificador del vídeo para posteriormente utilizarlo en la creación del URL de la imagen. Entonces creamos una función llamada getYoutubeID que parsea el URL ingresado y obtiene el Identificador y si la ruta es invalida devuelve una cadena vacía.
function getYoutubeID($url) {
$tube = parse_url($url);
if ($tube[“path”] == “/watch”) {
parse_str($tube[“query”], $query);
$id = $query[“v”];
} else {
$id = “”;
}
return $id;
}
Finalmente podemos mostrar el thumbnail del video en alta calidad de la siguiente forma:

<img src=”http://img.youtube.com/vi//0.jpg” />

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *