| Me gusta |
|
Ahora te mostraré cómo crear un simple reproductor de mp3 en tu web o blog. Está claro que existen muchos servicios que te bridan este tipo de servicio verdad?, la diferencia radica en que la mayoría de ellos incluye un link hacia ellos dejando escapar por ahí las visitas, cuando bien podrías hacer tu propio reproductor de música y sin publicidad incrustada y lo más importante de manera super sencilla.
Para este ejemplo necesitamos un sitio que nos permita subir gratis nuestra propia música a algún servidor(lugar donde se guardará la canción). Para esto nos valemos de openomy, un gran servicio que nos permite subir nuestros archivos individualmente sin mayores dificultades y sin tener mucho conocimiento de esto, pero si por ahí se traban, acá te doy la explicación:
1) Ve a http://www.openomy.com (Si no funciona openomy, anda a http://www.fileden.com, elige el plan gratuito, regístrate, sube tu mp3 y pásate al paso 4)
2) Tendrás que registrarte, colocando lo que siempre hacermos, un "username", un password (2 veces) y un email (2 veces) y listo.
3) Luego nos pide elegir nuestro archivo. En este caso, será una canción mp3, damos clic en el botón "examinar", buscamos nuestra canción mp3 en nuestra PC, la seleccionamos y luego damos clic en UPLOAD (en donde dice TAGs podemos escribir algunas palabras clave que identifiquen a tu tema separándolas con comas o sino déjalo en blanco).. y luego a esperar se ha dicho hasta que cargue toda nuestra canción en su servidor.
4) Una vez hecho eso, podemos renombrar nuestro archivo, en mi caso subí un extracto de 30 seg. de la canción "Noche de entierro" de los Benjamins y como pueden ver en la imagen siguiente, el nombre era algo complicado, así que decidí solo ponerle simplemente "nochedeentierro". Luego de ello, tenemos que darle clic en "Make Public" y listo!
Como verán, ahora contamos con una dirección pública que nos indica la dirección donde está guardada nuestra canción. En mi caso es esta:http://files.openomy.com/public/johantennassi/nochedeentierro
Una vez teniendo eso, ahora sí, configuraremos nuestro reproductor flash. Para ello nos valdremos de DewPlayer, que nos brinda un código (script) para que simplemente sea agregado a nuestro blog y listo.
Este es el script:
<object type="application/x-shockwave-flash" data="http://www.estvideo.com/dew/media/dewplayer.swf?mp3=http://tucancion.mp3&bgcolor=FFFFFF" width="200" height="20"> |
Entonces lo único que haremos es remplazar lo que está de rojo, es decir, donde dice http://tucancion.mp3 por la dirección que nos dió Openomy anteriormente. En mi caso, lo tendría que reemplazar por "http://files.openomy.com/public/johantennassi/nochedeentierro" quedando así:
<object type="application/x-shockwave-flash" data="http://www.estvideo.com/dew/media/dewplayer.swf?mp3=http://files.openomy.com/public/johantennassi/ |
Ahora solo queda pegar este código en tu blog y listo. Pero ojo! este código solo insertará tu reproductor flash mp3 en tu blog pero no se escuchará hasta que alguien le haga clic en el botón "play", para que se escuche automáticamente lo que tienes que hacer es agregarle lo siguiente a tu código:
Localiza esta parte de código:
dewplayer.swf?mp3=http://tucancion.mp3;bgcolor=FFFFFFY reemplázalo por este:
dewplayer.swf?mp3=http://tucancion.mp3&autostart=1&bgcolor=FFFFFFY si quieren que se reproduzca automáticamente y que además se repita la canción de manera indefinida, reemplácenlo por este:
dewplayer.swf?mp3=http://tucancion.mp3&autostart=1&autoreplay=1&bgcolor=FFFFFFRecuerda que donde dice "http://tucancion.mp3" será la dirección que te dió Openomy anteriormente.
Bien, eso es todo, ahora solo te queda agregar todo el código en tu web o blog. Para el caso de blogger o wordpress, puedes agregar el código directamente en tu post (para blogger en modo html) sin problemas o en algún lugar de tu sidebar(para blogger elegir agregar "nuevo elemento html").
Este es el resultado en mi caso:
Solo tiene un botón "play", "pause" y otro "stop", pero si quieres otros modelos como por ejemplo incorporarle "un controlador de volumen" puedes visitar Ayudaparaelblog que te muestra los códigos para todos ellos o también, puedes generar tu propio código luego de elegir tus propias opciones desde la misma página del creador donde podrás elegir tus propios colores, reproducción en blucle, autoplay, etc.
Enlace | Web del creador
Enlace | DewPlayer personlizado
Entradas Relacionadas:
- Cómo crear un Reproductor de MP3 en Flash
- Reproductor de Música MP3 para el Blog
- Tips básicos de Flash: Cómo centrar una película Flash en HTML
- Tip básico de Flash: Cómo desactivar el mensaje “Haga clic para activar y usar este control”
- inovartis: un buen contenedor de recursos de video para flash
- Tutoriales-Flash: una web con tutoriales flash gratis (.fla gratis)








136 comentarios:
Hola! Gracias por dejar tu comentario!
(Si no tienes activado algún perfil, elige la opción "Nombre/URL" y puedes dejar en blanco el campo 'URL' si lo deseas)