Las listas de reproducción del plugin jwplayer de wordpress, una estupenda opción para publicar playlists de youtube

Los vídeos de youtube los publico en la web a través del excelente plugin de wordpres jwplayer. que tiene un interfaz bastante chulo totalmente customizable, que es éste, incluso con la posibilidad de desactivar la reproducción por defecto en HD de los vídeos que a mí particularmente me gusta mucho (por eso el blog incluye el calificativo de HD)

Cuando tenía que insertar una lista de reproducción, me la hacía en youtube y luego embebía el código que te genera, como ésto

Pero no quedaba homogéneo, así es que me puse a investigar y resulta que el plugin jwplayer te permite insertar listas de reproducción con el mismo interfaz que usa para los vídeos con lo cual queda estéticamente mucho más bonito la reproducción en un mismo artículo de vídeos individuales y listas de reproducción

La forma de hacerlo es la siguiente:

Lo primero que hay que hacer es subir a la librería multimedia de WordPress los vídeos (realmente no se suben, sino que simplemente se incorporan en la base de datos multimedia los datos del vídeo (URL, thumbnail, etc). Esto se hace de la siguiente manera: en modo de edición de un artículo pinchamos al icono de subir/insertar elemento multimedia

Después seleccionamos External Media y pegamos la url del vídeo de youtube

Le damos a Añadir objeto y a Guardar todos los cambios

con lo cual ya tendremos el vídeo en la base de datos de youtube (Si le hubiésemos dado a Insert JW Player nos insertaría el vídeo en el post, pero esto no es lo que queremos ahora, sino que queremos incorporar uno a uno los vídeo de los que está compuesta la playlist, para luego generarnosla. Así haremos lo mismo uno a con todos los vídeos

Lo siguiente es definir la playlist con los vídeos insertados. Nos vamos a Multimedia Playlist y arrastramos a la izquierda los vídeos de la derecha que queramos incluir poniendo nombre a la playlist

 

A continuación lo que hay que generarse es un player particularizado al tipo de lista de reproducción que queramos.

Nos vamos a Jwplayer Crear Custom Player

y nos definimos el player concreto al tipo de playlist que queramos. Por ejemplo yo me he generado uno que se llama playlist-arriba,  y en la pestaña basic seleccionamos el ancho y el alto de la ventana de reproducción (en mi caso 620×360 que se adapta al formato del blog

Y en advanced le decimos en Playlist position Over (el parametro de debajo sólo aplica a cuando es del tipo Bottom como ya veremos)

Y por último hacemos la inserción de la playlist. Damos a insertar objeto

y seleccionamos Playlist y la playlist y el player que nos hemos definido (en este caso playlist-arriba)

Y violà cómo queda

LISTA DE REPRODUCCION ARRIBA

Si queremos que la playlist esté a la derecha en la sección Advanced cuando te defines el reproductor playlist-derecha hay que definir estos parámetros: playlist.position right y playlistsize 80 (80 son los pixels exactos para que el thumbnail de los vídeos de la derecha quede perfecto)

y así es cómo queda (en este caso no se ven los nombres de los vídeos porque si no le comeríamos mucho espacio al reproductor)

LISTA DE REPRODUCCION A LA DERECHA

Si queremos la playlist abajo en la definición de la pestaña basic del reproductor tenemos que aumentar el tamaño en vertical del reproductor. En mi caso la altura del playlist serán 180 pixels por lo que se los añado a los 360 de la altura del reproductor y defino 540 como altura del mismo

y en advanced seleccionamos playlist.position bottom y playlistsize 180

y así sería cómo queda (particularmente a mí es la que más me gusta)

LISTA DE REPRODUCCIÓN ABAJO

Por último si no queremos lista de reproducción en la definición del reproductor decimos Playlist.position None

y lo que tendremos es sólo botones en la parte inferior izquierda del reproductor para pasar al siguiente o al anterior vídeo. Así queda

SIN LISTA DE REPRODUCCIÓN:

Espero que os ayude a quien quiera definirse playlist con jwplayer. SI los videos no son de youtube el procedimiento sería el mismo solo que en la definición de los vídeos tendríamos que crearla a mano definiendo la URL del mismo y su thumbnail.Lo bueno de estas playlist es que se ven perfectamente, aparte de en ordenadores y en dispositivos android que reproducen flash, en dispositivos iOS del tipo iPad y iPhone que trabajan nativamente en HTML5 porque en estos casos la lista no se reproduce como flash sino como HTML5.
Por último, para que veáis que también se pueden hacer listas de reproducción de audio (concretamente en este caso de mp3) aquí tenéis gentileza de www.rtve.es una lista de reproducción de 11 canciones de Nacha Pop que publicaron en su web cuando murió Antonio Vega, que también se reproduce tanto en flash como en HTML5 en dispositivos IOS
PLAYLIST A LA DERECHA. A mí particularmente es la configuración que más me gusta cuando se trata de audio, porque no pasa nada si se reduce el espacio del reproductor. Concretamente la anchura en horizontal de la playlist es 310 pixels, la mitad de los 620 del ancho total del reproductor


1 Star2 Stars3 Stars4 Stars5 Stars (2 votes, average: 5,00 out of 5)
Cargando...

2 pings

  1. […] último aquí tenéis extraído de un artículo que he hecho sobre cómo se hacen listas de reproducción en jwplayer en youtube una playlist en la parte de arriba, de la derecha y de abajo del reproductor. Como véis las […]

  2. […] último aquí tenéis extraído de un artículo que he hecho sobre cómo se hacen listas de reproducción en jwplayer en youtube una playlist en la parte de arriba, de la derecha y de abajo del reproductor. Como véis las […]

Deja una respuesta

Tu dirección de correo electrónico no será publicada.

Time limit is exhausted. Please reload CAPTCHA.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.plugin cookies

ACEPTAR
Aviso de cookies