Visualizar miniaturas de vídeos de YouTube en tu WordPress

El vídeo es el rey de Internet y lo será por mucho tiempo. Ahora aprovechando el API de vídeo de Youtube podemos utilizar una sencilla técnica para mostrar una miniatura de un vídeo. A través de un código corto definido en functions.php.

Por defecto la miniatura por defecto de Youtube tiene un tamaño de 480×360 y la URL suele ser http://img.youtube.com/vi/rNWeBVBqo2c/0.jpg para por ejemplo el Video Id= rNWeBVBqo2c.

Luego esta la miniatura pequeña de 120×90 en http://img.youtube.com/vi/rNWeBVBqo2c/1.jpg para el mismo vídeo id de antes. Y otra miniatura más de 120×90 en http://img.youtube.com/vi/rNWeBVBqo2c/2.jpg.

Código corto para mostrar miniatura de vídeo de Youtube

Añade estas líneas de código a tu fichero functions.php para añadir el código corto.

/*
    Código corto para mostrar miniatura de un vídeo de youtube en su wordpress.
    Uso:
    [youtube_thumb id="VIDEO_ID" img="0" align="left"]
    VIDEO_ID= ID de vídeo Youtube
    img=0,1,2 o 3
    align= left,right,center
*/
function wp_youtube_video_thumbnail($atts) {
     extract(shortcode_atts(array(
          'id' => '',
          'img' => '0',
          'align'=>'left'
     ), $atts));
    $align_class='align'.$align;
    return '<img src="http://img.youtube.com/vi/'.$id.'/'.$img.'.jpg" alt="" class="'.$align_class.'" />';
}
add_shortcode('youtube_thumb', 'wp_youtube_video_thumbnail');

Para mostrar la miniatura de un vídeo de Youtube solo tienes que añadir el código corto en tus páginas o entradas de WordPress.

[youtube_thumb id=”rNWeBVBqo2c” img=”0″ align=”center”]

y con este código mostrarás la imagen en tu blog, elige cual quieres visualizar, la 0 para 480×360 ó 1, 2 ó 3 para 120×90, además de la alineación de la imagen izquierda, derecha o centrada (left, right, center).

Algunos ejemplos más serían los siguientes:

[youtube_thumb id=”rNWeBVBqo2c” img=”1″ align=”left”]
[youtube_thumb id=”rNWeBVBqo2c” img=”2″ align=”right”]
[youtube_thumb id=”rNWeBVBqo2c” img=”3″ align=”center”]

fuente: Snilesh

No hay comentarios

Dejar respuesta