flowPlayer es un reproductor de vídeos FLV, con soporte para FLV, SWF, MP3, MP4, H.264, JPG y PNG, soporte para listas de reproducción e incluso soporte para el protocolo RTMP (Flash Media Server, Red5) para vídeos en streaming y sobre todo es gratuito.
Características
flowPlayer es un reproductor muy bien logrado, fácil de utilizar y con muchas características destacables entre las cuales podemos listar:
- Soporte para Video (FLV, MP4, H.264).
- Vídeo en pantalla completa o fullscreen.
- Vídeos en Descargar progresiva (Para archivos FLV).
- Vídeos en Streaming (Flash Media Server, Red5).
- Soporte para thumbnail de vídeos.
- Soporte para controles mediante Javascript.
- Habilidad para reproducir playlists.
- Viene con varios temas o diseños incluidos.
- Facilidad para personalizar el player.
- Permite añadir publicidad antes de un vídeo.
Como utilizar flowPlayer
El uso es muy sencillo, primero descargamos los archivos desde Download Flowplayer, extraemos los archivos y escogemos el theme que mas se adecue a nuestras necesidades, luego con ayuda de SWFObject insertamos el vídeo, para ello primero incluimos SWFObject:
<script type="text/javascript" src="swfobject.js"></script>
Luego creamos un DIV que contendrá a nuestro vídeo player:
<div id="flowplayer">Flowplayer</div>
Finalmente insertamos el player, definiendo el vídeo que deseamos reproducir, esto lo pasamos con flashvar utilizando el método addVariable de SWFObject, esto de la forma:
so = new SWFObject("flowplayer.swf","swf","400","250","9",""); so.addVariable("config", "{videoFile: 'video.flv'}"); so.write("flowplayer");
[SWF]/wp-content/uploads/2008/05/flowplayerdark.swf, 400, 250, config={videoFile:’http://samples.unijimpe.net/video.flv’, autoPlay:false, loop:false}[/SWF]
Obviamente existen multitud de parámetros que podemos configurar para lo cual hay una documentación muy detallada en Flowplayer Configuration. De la misma forma se puede cambiar el skin del player, para ello pueden consultar Skinning tutorial.
Comentarios Total 30 comentarios
Publicado: 19/05/2008 3:02 pm
probando probando
Publicado: 20/05/2008 5:08 am
He estado consultando el manual y lo que no he encontrado es la forma de meter la publicidad antes del video. Me echas una mano?
Gracias por este blog!
Publicado: 20/05/2008 11:57 am
Excelente!, pero tanto en el ejemplo de aca, como en la prueba que hice en mi server, he visto que el video hace loop, me gustaria que una vez que finalizara se diera el stop.
Me dan una mano?
Publicado: 22/05/2008 1:06 am
Si no deseas que haga loop puedes utilizar el parámetro loop, con lo cual el parámetro config quedaría de la forma:
so.addVariable(«config», «{videoFile: ‘video.flv’, loop:false}»);
Ahora si por ejemplo deseas que no se reproduzca automáticamente puedes utilizar el parámetro autoPlay:
so.addVariable(«config», «{videoFile: ‘video.flv’, autoPlay:false}»);
Publicado: 22/05/2008 11:35 am
Perfecto!, me funciono.
Gracias unijimpe, te agradezco la ayuda, asi como tambien, la dedicacion que tomas para tu gran blog. Mi visita es diaria.
Publicado: 07/07/2008 3:45 pm
Hola unijimpe, la verdad q esta bueno q presentas estas cosas.
Yo tengo q hacer un reproductor para una web, y este debe cargar dinamicamente los videos a partir de las imagenes q se muestran, y al ver este proyecto y la gran cantidad de opciones que tiene he decido acceder.
Sin embargo, no puedo ni arrancar, trate de hacer este tutorial, pero la ultima parte, donde estan las variables, no me las toma, las toma como texto.
Yo queria saber si puedes subir el archivo donde este el codigo o que me ayudes, diciendome donde pongo esa parte y que extension debe tener el archivo.
Desde ya gracias y espero poder seguir viendo mas de estos tutoriales.
Saludos
Publicado: 15/08/2008 11:59 pm
sincerament no entendi bien la explicacion. Pongo todo asi?
Flowplayer
so = new SWFObject(«flowplayer.swf»,»swf»,»400″,»250″,»9″,»»);
so.addVariable(«config», «{videoFile: ‘video.flv’}»);
so.write(«flowplayer»);
Publicado: 08/09/2008 9:23 pm
por favor, estoy k me rompo la cabeza tratando de usar este programa pero hay algo k no se explica ( o yo no soy bueno en esto), es que ya tengo todo lo k me pides que baje pero no indicas que debo hacer con eso!!, digo, me das indicaciones pero no me dices como debo usar las cosas k bajé, y en la web principal no me dice k debo hacer con todo lo k bajé, a ver si me explicas como para burro por fa!!!
Publicado: 16/12/2008 10:04 am
hola miax, intersante tu colaboracion. hice la prueba y no em funca.
Publicado: 06/03/2009 6:39 pm
me sale igual q esta pagina…nunk termina de cargar y no sale el flow player…por que? heeeeeeeeeeeeeeeeeeeeeeeeeeeeelp!!!!!!
Publicado: 13/03/2009 12:15 pm
El codigo se inserta asi de facil…
igual que lo esta en esta web… exactamente igual…
div style=»text-align: center; width:400px; height:250px; line-height:250px; margin-left: auto; margin-right: auto; background: #FFFFFF;»>Cargando Flash
swfobject.embedSWF(«/linkURL…Player.swf», «video», «400», «250», «9.0.28.0», «», {config: «{videoFile:\’http://video.flv\’, autoPlay:false, loop:false}»}, {wmode: «window», menu: «false», quality: «high», bgcolor: «#FFFFFF», allowFullScreen: «true»}, {});
Publicado: 26/03/2009 4:50 pm
Hola a todos… en especial al creador de tan excelente blog…miren amigos ando desarrollando un proyecto web, y para tal uso el flowplayer… soy algo novato con el javascript… se hacer algunas cosillas con el flow y el javascript… pero en si lo que quiero hacer es lo siguiente…yo se que si me podran ayudar ademas que considero interesante para sus websites tambien…con el flowplayer obviamente en una pagina o apartado del site que cuando se acceda via http se abra automaticamente el flowplayer jalando un link externo de JUSTIN.TV que trasmite en vivo video pero en vez de ver el logo de justin dentro de la pantallita del flow ver el logo del site…que les parece? me dijeron que esas dos cosas 01..llamar al link de justin y 02… colocar mi propio logo se hacia con javascript…Si me apoyan… les paso todo el codigo completito para que lo hagan en sus sites…saludos
Publicado: 28/05/2009 2:24 pm
Hola. Mira la verdad q parece tan simple pero a nosotros no nos funciona. Ponemos todo como nos decis pero al final nada funciona.
Queremos poner el reproductor y q al lado tenga un playlist con todos nuestros videos q tenemos en nuestro hosting. Ya probamos y no funciona :S
Gracias por tu ayuda…
Publicado: 28/05/2009 2:26 pm
Una cosa mas…
El link para descargar ahi ya no existe :S
Publicado: 27/07/2009 9:55 am
Buenos dias, ya hice todo lo que indican, pero aún me falta poder configurar de tal manera que no se reprodusca automáticamente.
Tengo los tres archivos descargados, ya los subí. Quisiera que me ayudaras para saber cual tengo que modificar.
Gracias.
Publicado: 27/07/2009 7:46 pm
Byron, para reproducir automáticamente el vídeo debes agregar el parámetro autoPlay y asignarle el valor true:
autoPlay: true
Entonces el código quedaría de la siguiente forma:
so = new SWFObject("flowplayer.swf","swf","400","250","9","");
so.addVariable("config", "{videoFile: 'video.flv', autoPlay: true}");
so.write("flowplayer");
Publicado: 08/08/2009 11:55 am
K tal, ando construyendo mi pá web, y quiero ponerle simplemente unos videos, ya descargué el «flowplayer» pero NO SÉ COMO INSTALARLO…
Alguien peude echarme la mano para poder hacer mi pag con unos simples videos,..??
Se los agradecería mucho,… GRACIAS!!!
Publicado: 28/08/2009 4:58 am
q lasteima q el link ya no existe.
si alguien lo puede subir asi lo bajamos seria buenisimo
Publicado: 28/08/2009 5:00 am
aca lo encontre http://flowplayer.org/download/index.html
Publicado: 31/08/2009 1:38 pm
Me podrias informar como hago para agregar publicidad antes del video a mostrar? te agradeceria mucho.
Publicado: 20/10/2009 5:00 pm
ola yo kisiera una forma de ponerle una imagen de fondo en el flow player antes de darle a play o antes de que se reprodusca pero en java script
Publicado: 20/10/2009 5:07 pm
este es mi .js
{
autoPlay:false,
controlBarBackgroundColor:’0x3299CC’,
showMenu: false,
showFullScreenButton:true,
showWatermark:’always’,
watermarkUrl:’water01.png’,
watermarkLinkUrl:’http://.com’,
loop:false,
autoRewind:false,
autoBuffering:true,
useNativeFullScreen: true,
initialScale: ‘fit’
}
Publicado: 11/02/2010 6:23 am
Buenas tardes…
Resulta que utilizo swfobject 2.2 para cargar una serie de videos en una página que estoy haciendo de prueba. Hasta entonces yo llamaba al video de la siguiente forma:
Se supone que debe aparecer el video
var flashvars = {file: «video.flv»};
var params = {
allowfullscreen: «true»,
allowscriptaccess:»always»,
};
var attributes = {};
swfobject.embedSWF(«videos/player.swf», «container_video1», «320», «265», «9.0.0»,»expressInstall.swf», flashvars, params, attributes);
Esto me muestra el video perfectamente, pero con el player habitual de macromedia. Me gustaría que me cargara el flowplayer pero cuando sustituyo player.swf por flowplayer.swf (que está en la misma carpeta), me genera un error. Al principio llamo al «js/swfobject.js».
El error que me da es el «300: error al inicializar el player: type error #1009. A
Alguien me podría ayudar con ello.
Un saludo.
Publicado: 10/04/2010 1:07 pm
bueno yo lo instale y me funciono de maravilla, con los videos y videos de publicidad fantastico…
solo tengo un problema que no eh resuelto, como inserto una imagen para que cuando carge la pagina no este el fundo negro del player…
saludos y muchas gracias…
Publicado: 10/04/2010 2:11 pm
estimados amigos saben ya pude insertar la imagen…
ahora lo que estoy buscando no se si sea posible es lo siguiente:
se puden ver las listas de reproduccion a un lado del player,
es decir con una imagen y seleccionar el video a voluntad…gracias..
Publicado: 25/06/2010 9:45 am
Hola, excelentes comentarios, esto es una buena herramienta de ayuda.
mi pregunta es la siguiente: yo tengo funcionando perfectamente el player pero quisiera que se mostraran los videos de forma aleatoria para que no siempre tenga la misma secuencia, qué debo hacer?
el script es el siguiente:
<param name="flashvars" value="config={
showPlayList: true,
showPlayListButtons: true,
videoHeight: 240,
loop: true,
autoPlay:true,
initialScale: 'fit',
playList: [ video1, video2, video3…]
Publicado: 26/08/2010 10:07 am
buenas yo tengo un problema cargo mis videos en mi servidor pero no se muestran hasta que se carguen lo cual es molesto aver si me ayudas quiero que se puedan ver los videos mientras van cargando ya que algunos videos son muy largos
Publicado: 24/07/2011 8:34 pm
Hola mira ya logre que el script trabajara lo que no logoro es insertarlo en wordpress
Lo configure con Google Adsense Video puedes ver una muestra en http://ecine.in/videos/1.html
Espero me puedan ayudar a saber como insertarlo en wordpress
Publicado: 24/02/2013 9:30 am
hola a todos necesito ayuda, dos semanas anteriores solicite a google adsense videos su aprovacion y me an aseptado
pero tengo problemas para implementarlo el el reproductor jw
Publicado: 27/04/2013 10:19 am
Hola,
Y para introducir el código en Blogger como sería?
Me gustaría introducirlo para poner un video RTMP
gracias!