unijimpe » WP-SWFObject

Tips para Embeber Youtube

unijimpe — Tue, 07 Jul 2009 04:59:19 +0000

Si eres usuario de Youtube debes estar familiarizado con el código para embeber los vídeos en otras paginas web, esta vez les presentamos algunos tips para mostrar los vídeos en iPhone y controlar algunos parámetros adicionales.

URL del Vídeo
Cuando se embeben o incluyes los vídeos de Youtube esto tienen la siguiente estructura, donde ID es el identificador del vídeo el cual lo podemos identificar directamente en el URL de la página que estamos viendo.

http://www.youtube.com/v/ID

Código por defecto de Youtube
Si estas viendo un vídeo de Youtube y deseas incluirlo en tu web el código por defecto será de la forma:

width="425" height="344">
name="movie" value="http://www.youtube.com/v/ID">
name="allowFullScreen" value="true">
name="allowscriptaccess" value="always">
src="http://www.youtube.com/v/ID"
type="application/x-shockwave-flash" allowscriptaccess="always"
allowfullscreen="true" width="425" height="344"></embed>

Modificando el código para Embeber
Si deseamos que los vídeos de Youtube se interpreten automáticamente en el iPhone, entonces tenemos que hacer la siguiente modificación con lo cual se visualizará correctamente en todos los Browser y en el iPhone/iPod Touch.

type="application/x-shockwave-flash"
width="425" height="344" data="http://www.youtube.com/v/ID">
name="src" value="http://www.youtube.com/v/ID" />
name="wmode" value="transparent" />
name="allowFullScreen" value="true" />

Agregando Parámetros Adicionales
Con el código anterior, tendremos nuestros vídeos pero estos no se pueden ver en fullscree, se muestran las estrellas para votar por el vídeo, se muestras los vídeos relacionados y hasta un buscador. Pero todo esto lo podemos controlar con los parámetros adicionales de configuración documentados en YouTube Embedded Player Parameters.

rel (0 ó 1) mostrar los vídeos relacionados.
autoplay (0 ó 1) reproducir automáticamente el vídeo.
fs (0 ó 1) mostrar el botón para ver el vídeo en fullscreen.
hd (0 ó 1) visualizar el vídeo en alta calidad (HQ).
showsearch (0 ó 1) mostrar/ocultar el buscador de vídeos.
showinfo(0 ó 1) para mostrar el título y el ranking.
iv_load_policy (1 ó 3) mostrar/ocultar las anotaciones.

Ejemplo Práctico
Si por ejemplo deseamos incluir un vídeo que tenga la posibilidad que se reproduzca en pantalla completa, y que se oculten el título, ranking y anotaciones entonces el URL del vídeo sería de la forma:

http://www.youtube.com/v/ID&fs=1&showinfo=0&iv_load_policy=1

Entonces si estamos viendo un vídeo en http://www.youtube.com/watch?v=8C7SxYzDNZk, entonces el identificador del vídeo es 8C7SxYzDNZk entonces el cóidgo completo para incluir el vídeo sería de la forma:

type="application/x-shockwave-flash"
width="425" height="344" data="http://www.youtube.com/v/8C7SxYzDNZk&fs=1&showinfo=0&iv_load_policy=1">
name="src" value="http://www.youtube.com/v/8C7SxYzDNZk&fs=1&showinfo=0&iv_load_policy=1" />
name="wmode" value="transparent" />
name="allowFullScreen" value="true" />

Con lo cual obtendríamos el siguiente resultado.

Plugin para WordPress
Si tienes un blog en WordPress puedes instalar el plugin WP-SWFObject el cual incluirá el código optimizado para iPhone, y te dará un panel de configuración para los parámetros opcionales de los vídeos Youtube, para mayor información puedes visitar WP-SWFObject.

© 2006 - 2011 unijimpe - Utiliza este feed solo para uso personal, partes de este feed pueden ser utilizados mencionando al autor, no esta permitido publicar enteramente este feed para uso comercial sin permiso del autor.

WP-SWFObject 2.2

unijimpe — Thu, 07 May 2009 04:33:56 +0000

Luego de días de trabajo, pruebas y sugerencias de parte de nuestros visitantes tenemos el agrado de presentarles WP-SWFObject 2.2 el plugin para wordpress que permite publicar archivos SWF de manera sencilla.

Que hay de nuevo en esta versión?
Se han corregido algunos bugs y se han implementado nuevas opciones.

Corrección del parámetro wmode que no cambiaba.
Nuevo formato de publicación XHTML el cual genera el código embed.
Mejor integración con vídeos de Youtube, se formatea correctamente los URLs.
Integración del parámetro fullscreen con el reproductor de Youtube.
Opción para configurar si se permite ver los detalles del vídeo Youtube.
Detección de navegadores iPhone para mostrar un mensaje configurable.
Si se publica un vídeo de Youtube y el browser es de iPhone se muestra la imagen del vídeo con un enlace para visualizar el vídeo en Quicktime de iPhone.

Novedades para vídeos Youtube
Ahora es mas sencillo publicar vídeos de Youtube, por ejemplo para un vídeo que tiene la dirección: http://www.youtube.com/watch?v=6hzrDeceEKc podemos incluir el vídeo mediante las dos siguientes opciones:

[SWF]http://www.youtube.com/watch?v=6hzrDeceEKc, 400, 320[/SWF]

[SWF]http://www.youtube.com/v/6hzrDeceEKc, 400, 320[/SWF]

Los cuales generan el siguiente resultado:

Además si se accede mediante iPhone se visualizará una imagen del vídeo con un enlace para reproducir el vídeo en Quicktime.

Instalación
Para los usuarios que ya tienen una instalación previa pueden actualizar directamente desde el panel de Plugins en caso contrario pueden instalarlo automáticamente pues el plugin esta disponible en WordPress.org.

WP-SWFObject 2.1

unijimpe — Mon, 17 Nov 2008 01:13:54 +0000

Nuevamente les presentamos una actualización de nuestro plugin WP-SWFObject el cual permite insertar archivos Flash en WordPress de manera sencilla. Esta nueva versión trae nuevas funcionalidades, optimización del código fuente para mejorar la velocidad del script.

Que trae esta nueva versión?
Entre los cambios mas importantes podemos mencionar.

Hemos escrito completamente las funciones, eliminando variables adicionales, reduciendo el tamaño del código y mejorando el rendimiento.
Se corrigieron errores de sintaxis en el formulario de configuración.
Ahora hay una nueva opción para seleccionar la versión de SWFObject a utilizar, incluso se permite el uso de SWFObject desde Google AJAX Libraries API.
Se modificaron las funciones para mostrar los elementos Flash y ahora no hay necesidad de que el template tenga una llamada a wp_footer.
Se modificaron los estilos para la alineación de los elementos Flash.
Se agregaron estilos para delinear los bloques donde se muestran los SWFs.

SWFObject Version
Esta nueva cualidad permite seleccionar entre tres versiones:

SWFObject 1.5
Utiliza la sintaxis antigua de SWFObject la cual puede facilitar la compatibilidad con otras librerías, es ligera y con sintaxis ampliamente conocida.
SWFObject 2.0
Hace uso de la sintaxis de SWFObject 2.0 la cual es mucho mas potente, además cumple los estandares.
SWFObject 2.0 (from Google Library)
Utiliza la sintaxis de SWFObject 2.0, pero enlaza la librería directamente desde Google AJAX Libraries API, acelerando la velocidad de carga.

Nuevamente gracias a nuestros visitantes por sus sugerencias y observaciones, gracias a ello seguimos trabajando para mejorar cada día este popular plugin. Si ya estas utilizando este plugin y puedes actualizarlo automáticamente, de lo contrario puedes descargarlo e instalarlo manualmente.

Ahora si tienen preguntas y/o comentarios lo pueden hacer en el foro: WP-SWFObject Forum.

WP-SWFObject 2.0

unijimpe — Mon, 07 Apr 2008 01:45:38 +0000

Hoy tenemos el agrado de presentarles la nueva versión del popular plugin para insertar Flash en WordPress, esta nueva versión funciona con SWFObject 2.0 recientemente lanzado y el cual es la forma estándar de incluir SWFs en páginas HTML.

Esta nueva versión incluye correcciones que nuestros visitantes muy amablemente nos han hecho llegar, entre las principales características podemos destacar.

Uso de la nueva versión del script SWFObject 2.0.
Corrección de la inclusión de parámetros por Flashvars.
Soporte para alineación del SWF (left, center, rigth).
Cambio de estilos en el panel de administración compatible con WordPress 2.5
Cambio en la organización de los archivos.
Optimización del código y variables.

Instalación Automática
Si es que ya tienes instalado versiones anteriores del plugin y tienes WordPress 2.5 puedes utilizar la forma automática de instalación, para ello accedes al panel de plugin y seleccionan la opción Automatic Upgrade.

Instalación Manual
La forma manual de instalar el plugin es primero descargar la ultima versión de WP-SWFObject 2.0. Luego extraer el archivo en la cual encontrarás una carpeta llamada wp-swfobject. El siguiente paso el colocar la carpeta wp-swfobject en el directorio de plugin (wp-content/plugins/). En el panel de administración, en la opción 'Plugins', activar WP-SWFObject y finalmente en 'Options' > 'WP-SWFObject' encontrarás las diversas opciones para configurar el plugin.

Ejemplo
Si deseamos por ejemplo incluir un vídeo de Youtube el cual tiene el url http://www.youtube.com/watch?v=3-F5L1S7LKU. Luego para incluir este vídeo en nuestro blog lo haríamos de la siguiente forma:

[SWF]http://www.youtube.com/v/3-F5L1S7LKU, 425, 355[/SWF]

Con el cual obtenemos el siguiente resultado.

Pueden encontrar mayor información en la página oficial del plugin: WP-SWFObject además si tienen preguntas y/o comentarios lo pueden hacer en el foro: WP-SWFObject Forum.

Versiones de WP-SWFObject

unijimpe — Wed, 20 Sep 2006 10:09:38 +0000

WP-SWFObject ha ido evolucionando desde su lanzamiento y ha llegado a una versión estable. Este plugin para WordPress se ha vuelto muy popular y ha sido comentado en muchos idiomas descargado por muchos usuarios.

Bueno aprovechando que Box.net nos permite compartir carpetas, hemos agrupado todas la versiones de WP-SWFObject y las ponemos a disposición de nuestros visitantes para que puedan estudiar la evolución de este plugin. Desde luego que la programación no es muy complicada pero es muy descriptiva si es que deseas implementar algun plugin para WordPress.

Como comentario adicional les cuento que utiliza Box.net para compartir archivos pues me permite hacer un seguimiento del total de descargas, estas estadisticas para WP-SWFObject las publicaré mas adelante.

GoogleVideo en WordPress

unijimpe — Thu, 07 Sep 2006 20:14:29 +0000

Google Video el servicio de Google para alojamiento de Videos cada dia esta mejorando y con mas facilidad se puede encontrar videos de buena calidad y de los mas interesantes, esta ves les daremos una pequeña guia de como insertar videos de Google Video en nuestro blog WordPress.

Para hacerlo sencillo utilizaremos el plugin wp-swfobject del que ya hemos hablado con anterioridad. El primer paso es acceder a Google Video y ubicar lo que deseamos, para ello buscamos por categorías o utilizamos el buscador.

Una vez que hemos ubicado el video, en la parte derecha de la pantalla se nos muestra los detalles del video, además de un boton azul que dice "Email - Blog - MySpace", al hacer click en este boton aparecerá un formulario para envíar el video por correo electronico, ademas de ello se nos brinda un enlace llamado "Embed HTML" que es el que nos dará el código HTML para insertarlo en cualquier página.

El código HTML que se nos brinda es de la forma:

style="width:400px; height:326px;"
id="VideoPlayback" type="application/x-shockwave-flash"
src="http://video.google.com/googleplayer.swf?docId=-3681828910199344628&hl=en">
</embed>

Este código lo podemos insertar sin ningún problema en nuestros posts e insertará el video correctamente, pero si nos fijamos bien, Google Video tiene un reproductor de video hecho en flash por lo cual podemos insertar este código haciendo uso de nuestro plugin wp-swfobject, para este caso examinando el código anterior, obtenemos el url del video, el alto y el ancho con lo cual tendriamos que insertar con wp-swfobject lo siguiente:

[SWF]http://video.google.com/googleplayer.swf?docId=-3681828910199344628&hl=en, 400, 326[/SWF]

Con lo cual el resultado seria el siguiente:

WP-SWFObject 1.3

unijimpe — Sat, 02 Sep 2006 10:27:27 +0000

Nuevamente gracias a sus muchos comentarios y observaciones tengo el agrado de presentarles la nueva actualización del plugin que ustedes han acogido de muy buen agrado.

Esta nueva versión: wp-swfobject-1.3.zip, corrige un error encontrado para navegadores Internet Explorer. Se modifico el código de inserción de SWFObject y se agrego generación de IDs de swf usando la función MD5.

Además de ello hemos agregado una página WP-SWFObject donde hemos ordenado toda la documentación disponible para wp-swfobject.

Debo agradecer a todos nuestros visitantes por todos sus comentarios, gracias a ello este plugin que nació con la necesidad de facilitar la inserción de contenido Flash en mis posts hoy en dia haya llegado a una versión estable con un panel de configuración y con la posibilidad de insertar SWF en cualquier parte del blog.

Videos YouTube en WordPress

unijimpe — Thu, 24 Aug 2006 20:55:42 +0000

Este tema responde a la consulta de uno de nuestros lectores y como poner un video de YouTube en tu Blog WordPress, desde luego usando WP-SWFObject.

Primero que nada lo que necesitamos es tener instalado wp-swfobject, el plugin para insertar Flash en tu WordPress, luego entramos a www.youtube.com y buscamos en video que deseamos incluir en nuestro blog.

Una vez ubicado el video que deseamos, si nos fijamos en la parte derecha de la pantalla se tiene About This Video.

En esta parte se muestran mas datos de video, entre ellos el campo Embed que contiene el código para insertar el video en cualquier página, el código es de la forma:

width="425" height="350">
name="movie"
value="http://www.youtube.com/v/8C7SxYzDNZk">
src="http://www.youtube.com/v/8C7SxYzDNZk"
type="application/x-shockwave-flash"
width="425" height="350"></embed>

De esto código es muy claro cual es la url del video y el ancho y el alto del mismo, con esto ya podemos insertar el video en nuestro blog, para ello usamos la sintaxis del wp-swfobject con lo cual se tendría para insertar el video:

[SWF]http://www.youtube.com/v/8C7SxYzDNZk, 425, 350[/SWF]

Con lo cual tendríamos el resultado que se muestra a continuación y como se darán cuenta todo con menos de una línea, desde luego ya evitando el problema de ActiveX con IE.

WP-SWFObject 1.2

unijimpe — Sun, 20 Aug 2006 08:19:50 +0000

Gracias a los comentarios de nuestros visitantes, hemos detectado un pequeño problema con el plugin y desde luego hemos revisado el código nuevamente y ahora estamos en condiciones de entregarles una nueva versión.

Les presentamos wp-swfobject.1.2.zip la nueva actualización de este plugin que se esta volviendo cada vez mas popular gracias a ustedes.

Nuevamente espero sus comentarios, observaciones y sugerencias para mejorar este plugin. Saludos.

WP-SWFObject 1.1

unijimpe — Tue, 15 Aug 2006 07:55:41 +0000

Gracias a los comentarios de nuestros visitantes, decidí hacer una nueva actualización del plugin WP-SWFObject. Esta vez he agregado una función para insertar contenido flash en cualquier parte de tu blog.

Primero descarga wp-swfobject-1.1.zip, instala los archivos en tu directorio de plugins. Para utilizar esta nueva opción se tiene una función llamada wp_swfobject_echo, el cual tiene la siguiente notación.

wp_swfobject_echo("swffile", "swfwidth", "swfheigth");

Donde se tiene:

swffile: Archivo swf a insertarse.
swfwidth: Ancho de la película a insertarse.
swfheigth: Alto del movie a insertarse.

Entonces ahora si necesitas colocar tu header un flash, editas tu template y utilizas la función arriba explicada. Como ejemplo en el sidebar de este blog he insertado una pequeño botón utilizando el siguiente código.

class="side" style="text-align:center;">
wp_swfobject_echo("boton.swf","100","22"); ?>

Nuevamente gracias por sus comentarios y sugerencias, con mucho agrado seguiré agregando opciones para este plugin que gracias a ustedes tiene todas estas actualizaciones.