La mejor manera de insertar videos en un blog Wordpress (Flash media player+wordtube+blip.tv) - Parte 2


Y llegó nomás la segunda parte del tutorial. La primera podés encontrarla aquí. Por cualquier cosa, aquí tenés un somero resumen de los pasos anteriores a lo que vamos a explicar aqui:
- Instalá el plugin wordtube.
- Sacá una cuenta en blip.tv.
- Subí tu vídeo a blip.tv
- Copiá la URL del archivo .flv y la de la vista previa .jpg del vídeo que subiste.
- Subí tu video al Media Center de Wordtube, linkeando a las URL del vídeo
- Inserta tu vídeo en tu post.
Y ahora sí, veamos que hay de nuevo.
¡Quiero Más! Listas de reproducción:
Sin duda una de las mejores cosas de este método, es la posibilidad de tener varios vídeos en un mismo reproductor. Para esto, seguí los pasos anteriores, excepto la parte de insertar el vídeo en tu post.
Estamos en el Media Center (que está en el menú “Administración”). Para crear una nueva lista, hay que hacer click en el link “Editar”, que está al lado de “Previsualización de la Lista de Reproducción”. Nos va a llevar a esta pantalla:
Rellena los campos que están bajo el título “Agregar Lista de Reproducción” y hacé click en “Add Playlist”.
Con esto acabas de crear una lista de reproducción.
Ahora solo falta agregar los vídeos a esa lista. Para eso, volvé al “Media Center”, en donde tenés la lista de todos los vídeos que subiste hasta el momento. Hacé click en el link “Editar” a la par de los videos, y vas a ver una pantalla parecida a esta:
Ahora solo tenés que hacer click en la casilla de la lista a la que querés agregar tu video, en la ventana a la derecha que dice “Selecciona una lista de reproducción”.
Hacés click en actualizar, y listo. Repetí este paso con todos los vídeos que quierás a agregar a la lista de reproducción.
Agregar una lista de reproducción al post:
Podés hacerlo de forma muy similar a la que se usa para agregar vídeos:
- Podés escribir en el editor[PLAYLIST not found]donde xx es id del vídeo, que es un número que podés ver desde el menu Media Center (que está dentro de “Administrar”
- La otra es usar el icono de wordtube que aparece en el editor en modo WYSIWYG (el comúnmente utilizado):
Basta con elegir el archivo y clickear en “Insertar Lista de Reproducción”.
Siendo obediente: respetando los estándares
Este blog actualmente aprueba la validación de xhtml, y quería que siga siendo así. Sin embargo, cuando empecé a usar wordtube, me di cuenta de que había un problema: mi página ya no validaba. Luego de buscar el error por un rato, me di cuenta de que el problema era que Wordtube ponía su código dentro de los tags <div> y </div>, algo normalmente no problemático, a no ser porque el wordpress pone sus parrafos dentro de esos tags. Y un <div> dentro de un <p> es algo no aceptado en xhtml. Pero eso se soluciona de manera muy simple:
Andá al directorio de plugins del wordpress, entrá a la carpeta wordtube y abrí con un editor el archivo wordtube.php.
En la línea 201 cambiá:
$replace .= "\n".'<div class=”wordtube” id=”‘.$playmode.$video_id.’”>’;por
$replace .= "\n".'<span class=”wordtube” id=”‘.$playmode.$video_id.’”>’;
y en la 202 cambiá:
$replace .= '<a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see the wordTube Media Player.</div>‘; por
$replace .= '<a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see the wordTube Media Player.</span>‘;
Para finalizar, en el wordpress, hacé click en “opciones” y luego en “wordtube”. Como supondrás, con esto entrás a las opciones del wordtube. Buscá la que dice: ” Validar XHTML” y marcá la casilla que está al costado y voilà, tenés un wordtube respetuoso de los estándares.
Nota: Expuse este problema en los foros de wordtube, y por lo que me dijo el creador de este plugin al parecer está de acuerdo en cambiar en las próximas versiones el código generado por wordtube, así que habrá que estar atento con eso.
Cambiando el tamaño del vídeo y/o la vista previa.
Supongamos que no nos gusta la vista previa de nuestro vídeo. Esto puede ser por múltiples razones, tal vez no muestra nuestro mejor perfil, o aparece un pesado que preferimos no ver. O tal ves puede ser por otro motivo: una de las opciones muy piolas del wordtube, es que permite cambiar el tamaño del reproductor y del vídeo. Sin embargo esto trae aparejado un pequeño problema estético: en general la vista previa del vídeo será del mismo tamaño que el vídeo, y si a este se lo hace más grande, la vista previa también se agranda, pero con una calidad que deja que desear.
El problema es que el algoritmo del navegador para cambiar de tamaño las imágenes del navegador deja bastante que desear.
La solución en cualquiera de los casos pasa entonces por hace una nueva vista previa, cambiando el tamaño de la imagen con algún programa de edición gráfica. Asi que aquí entramos en cosas un poquito más avanzadas.
- Primero tendrías que usar un programa para hacer una vista previa de alguna parte de tu vídeo. Si este está en formato Avi, podés probar el editor avidemux, que tiene versiones para windows y linux y viene que muchos codec’s incorporados. Abrí el vídeo elegí la imagen que querés para la vista previa y anda al menú “Archivo” y luego a “save” / “Save as bmp”. Guardá esa imagen en un lugar cómodo.
- Luego, tenés que usar un editor de imágenes para agrandar la imagen que recién guardaste, al tamaño que va a tener el vídeo. Yo uso el gimp, con el cual tienenes que abrir la imagen, ir al menú “Imagen” y luego a “escalar imagen”. Ingresa el nuevo tamaño y en interpolación elige cúbica. Luego guarda la imagen con la extensión .jpg, y en la calidad del jpg puedes poner algo así como 77.
- A continuación, logueate en tu cuenta de blip.tv. Andá a “Dashboard” y hacé click en el link “edit”. Eso nos lleva a otra página, en la que hay a donde dice “Thumbnail” y adjuntar el archivo de la imagen que modificamos. Clickear el boton del final “Update your post”. Luego, al “Dashboard” de nuevo,hacés click en en el link “Share” a la par de tu video, vas a la pestaña “permalinks” y copiás la dirección que está abajo de “The thumbnail for this post can be accessed directly at the following URL:” (es la dirección al archivo .jpg de la vista previa)
- Finalmente, en el wordpress, andá a “Administrar” y luego a “Media Center”.Hacé click en el link “Editar” que está al lado del vídeo al que le vas a cambiar la vista previa. Donde dice “URL de la miniatura” insertá la dirección que acabas de copiar.
- Listo el pollo!
Aquí tenés un ejemplo.
Antes:

Después:

Como ves, hay una sutil pero notoria diferencia.
Se que parece muy complejo, pero no te lleva más de 5 min. hacerlo, y mucho menos tiempo cuando tenés práctica. Con eso termina este tutorial de dos partes.
Saludos!
2 Comentarios
RSS feed para los comentarios de esta entrada. TrackBack URI





La mejor manera de insertar vídeos en un blog Wordpress (Parte 2)…
En esta segunda (y última) parte del tutorial sobre insertar vídeos en un blog wordpress con wordtube y blip.tv, veremos tres cosas muy útiles, que no se pueden hacer con la mayoría de los otros reproductores: Vamos a crear una lista de reproducci…
Retroenlace por meneame.net
— Junio 20, 2007 #
No puedo encontrar el Media Center en la version 2.5.1 de wordpress
Comentario por Wal Durán
— Mayo 6, 2008 #