JMiur [E]

Hay dos posibilidades para insertar audio MP3 en Blogger. La primera es utilizar servicios como
GoEar, Odeo o Twango que nos permiten subir los archivos de audio y además, nos proveen con un reproductor que podemos insertar en el blog o bien, utilizar un servicio de hosting y utilizar un reproductor personal.


Sin duda, esta segunda opción es la más interesante ya que nos permite independizarnos de los servicios y sus restricciones.

Para hacer esto, sea cual sea el reproductor que elijamos, el procedimiento es siempre el mismo:
  1. Descargar el reproductor SWF y, eventualmente, algún archivo extra.
  2. Alojarlos en un servidor externo.
  3. Subir los archivos de audio a reproducir a cualquier servidor.
  4. Copiar y pegar el código correspondiente a cada reproductor en el lugar de la página donde queremos que aparezca.
  5. Modificar la dirección URL del reproductor para que coincida con la dirección URL donde lo hayamos alojado.

En términos generales, la estructura del código es siempre la misma y no difiere demasiado del código empleado para insertar videos.

Hace tiempo, comenté sobre unos de estos reproductores, probablemente uno de los más simples de insertar, llamado DewPlayer ahora, trataré de mostrar otros, cada uno con sus propias características.

En 1 pixel out encontramos uno, originalmente creado como plugin para WordPress pero que puede adaptarse perfectamente a Blogger. Podemos bajarlo en un archivo ZIP, descomprimirlo y utilizar los únicos archivos requeridos: player.swf y audioplayer.js.

El script se coloca en cualquier parte del HEAD de la plantilla:
<script language="JavaScript" src="URL_audioplayer.js"></script>
El código a insertar donde quiera verse el reproductor es el siguiente:
<object width="300" height="24" id="audio1"
type="application/x-shockwave-flash"
data="URL_player.swf">
<param name="movie" value="URL_player.swf"/>
<param name="FlashVars" value="playerID=1&soundFile=URL_archivo.mp3" />
<param name="wmode" value="transparent" />
</object>

En este caso, como en casi todos los siguientes ejemplos, utilizamos la etiqueta PARM para indicar el archivo MP3 a ejecutar y los parámetros de configuración optativos. Dentro de esta etiqueta, colocamos el atributo name="FlashVars" y en el atribut0 value, colocamos los datos específicos.
value="playerID=1&soundFile=URL_archivo.mp3&parametro=valor"
Si quiere agregarse otro reproductor en la misma página, se usa el mismo código y se cambia el atributo ID, (por ejemplo, id="audio2") . El reproductor puede personalizarse utilizando los siguiente parámetros:
bg=0x000000 color de fondo leftbg=0x000000 color del fondo izquierdo y rightbg=0x000000 color del fondo derecho lefticon=0x000000 y righticon=0x000000 íconos izquierdo y derecho rightbghover=0x000000 color fondo derecho cuando se efectúa un rollover righticonhover=0x000000 color del ícono derecho cuando se efectúa un rollover text=0x000000 color de los textos slider=0x000000 color de la barra de desplazamiento track=0x000000 color de las pistas border=0x000000 color del borde loader=0x000000 color de la barra de carga loop=yes|no establece si se repite automáticamente autostart=yes|no establece si se ejecuta al inicio
Los parámetros, se agregan en la misma etiqueta que contiene la URL del archivo de audio. Por ejemplo:
value="playerID=1&soundFile=URL_archivo.mp3&righticonhover=0xFF9933"

44 comentarios:

Anónimo  

Estoy seguro que en el futuro manejaré las cosas que explicas sin problema -creo- pero hoy en día siento que me superan... :(

Un saludo!

Responder
JMiur  

Jajaja, es cuestión de intentarlo, no te creas que es tan complicado :)

Responder
Negrolosz  

Hola sinceramente intente un millon quinientas mil veces y voy por una mas, te pido un favor para alguien que no entiende nada de esto me podrias explicar, que debo reemplazar cuando decis "URL_player.swf" te referis a la url de mi blog? y cuando te referis a "URL_archivo.mp3" me imagino que te referis a la de goear?

Respecto a poner en el head de la plantilla el siguiente codigo script language=JavaScript src=URL_audioplayer.js scrip hay dos head uno al comienzo de la plantilla y el otro en el footer, en cual hay que pegarlo?

bueno desde ya gracias
y disculpas pero no entiendo nada de esto y me lleva mas tiempo que a otros.

Nuevamente te pido disculpas pero cuando voy mandar el mensaje me dice que no permite el ingreso de codigos por eso te lo envio asi a
el codigo que va en el head

Responder
Negrolosz  

Otra consulta que url hay que poner en el head?

Responder
JMiur  

URL_player.swf es la dirección donde hayas alojado el reproductor. Debes ubirlo a alguna parte. El mismo servicio te dirá cuál es esa dirección o enlace.

URL_archivo.mp3 es lo mismo peor del archivo de audio a reproducir.

URL_audioplayer.js es lo mismo, pero para el archivo JS.

Unapágina web solo tien un HEAD, es todo lo que está entre las etiquetas <HEAD> y </HEAD>. Ubicarlas justo antes de </HEAD> es la forma más sencilla de agregar scripts.

Responder
Niño B  

primero que nada muchas gracias, pero ahora: un par de cositas.

El archivo mp3lo inserto con la direccion que me da el goear? porque en ese caso no termina .mp3.

Lo que hice yo fue subir todo a google pages, incluso el archivo mp3 y ahi si me quedo con la extension que se pedia (o sea .mp3)

Y lo segundo es que no se porque con el codigo html que tengo luego de agregarle las direcciones y eso, me provoca error en los post, pero no en el footer, donde lo puedo insertar perfectamente.

No se que pasa, pero desde ya muchas gracias por el aprendizaje y por la futura respuesta.

Responder
JMiur  

Lajos:

La direcciòn de GoEar no serviría ya que no es un MP3 sino un archivo de Flash que reproduce música. No hay más alternativa que alojar los MP3 en un sitio como Google Pages o similar; no hay muchos.

Con respecto al código, debería verlo. Si está online y me dices donde, puedo chequearlo. Sino, me mandas un mail para revisarlo,.seguramente es un detalle en la sintaxis.

Responder
Anónimo  

Antes que nada quiero felicitarte por este gran aporte de información que dejas en este maravilloso blog que has creado, muchas cosas serían imposibles de hacer para personas como yo, que nada tenemos que ver con este mundo de las computadoras. Así que de antemano muchas gracias.
Me gustaría hacerte una pregunta, que espero puedas constestarme, es en relación a estos reproductores flash, en particular por el 1 pixel out para WordPress y es que luego de hacer todos los pasos que tu indicas tengo el siguiente problema, no sé como hacer para que muestre el titulo del tema y su autor, en su lugar salen simbolos, cuadrados y algunas letras... bueno esa sería la pregunta.

Te felicito nuevamente y espero que tengas un buen día.

G.C

Responder
JMiur  

Gustavo:
Realmetne es extraño, parecería un problema que tuviera que ver la codificación de caracteres pero, el problema excede mis conocimientos.

Responder
Nina  

uff, no entendí nada, no tienes algun manual mas sencillo para gente sencilla como yo? jajaja ^^ jeje saludos!!

Responder
Anónimo  

Mirá que he usado reproductores eh? Pero estoy encantada con este!

Muchas gracias! (Cumpleañero) ;-)

Responder
DanSv  

Hola he intentado añadir aqui un comentario/consulta pero no me deja, te lo he pasado por mail pk igual al ser largo no me lo deja publicar aki! graciassss

Responder
Carlos  

hola me gustaria que me respondieras si solo musica en formato mp3 puede reproducir o asepta otros formatos

Responder
JMiur  

Hasta donde sé, la mayoría sólo acepta MP3s

Responder
Emile  

Usé este reproductor en el blog de una amiga, alojando todo (archivos y audio) en SkyDrive, y funcionó bien hasta hace dos días. Viendo qué pasaba, la cuestión fue que cambiaron las URLs :O No es que había usado dos exploradores diferentes para obtenerlas, siempre fue con Firefox.
¿Otro misterio que quedará sin resolver?
Saludos.

Responder
JMiur  

¿Cambiaron las URLs de SkyDrive? Eso nunca lo vi. Es realmente raro :D

Responder
Anónimo  

Hola quiero hacerte una pregunta que no tiene nada que ver con esto.
Quisiera saber si me podrias explicar como puedo insertar en mi blog un enlace para que los que esten interesados puedan mandarme un e-mail directamente de mi página. Osea que se habra una ventana y que ya aparezca mi dirección como destinatario y que despues puedan escribir el mensaje.
No se si sabes como hacer eso y no se si me entendiste. Pero bueno, aca te dejo mi e-mail para que te pongas en contacto conmigo si es que me podes ayudar con ese tema.
Muchas Gracias desde ya,
Agustín.

Responder
Anónimo  

Aca esta mi e-mail que me olvidé de ponerlo en el mensaje anterior jaja: agustin_gf1@hotmail.com

Responder
JMiur  

Eso sólo puede hacerse de manera parcial, utilizando este sistema, o bien, registrándose en un servicio que permita agregar un formulario de contacto.

Responder
silpivipiapa  

me he estudiado profundamente estos comentarios mi querido santo señor tengo un reproductor DewPlayer, que lo tengo subido a Fileden, donde tambien he subido los mp3, he cogido el codigo de tu blog, y he insertado correctamente los swf y los mp3, y sin embargo cuando lo inserto en mi blog, sencillamente no aparece....sin embargo en la misma pagina, habia colgado otra canción con el mismo sistema, y me ha funcionado perfectamente...pero hay dos detalles de este post que me tienen en la duda...pues no entiendo a lo que te refieres uando dices....

"Modificar la dirección URL del reproductor para que coincida con la dirección URL donde lo hayamos alojado."

¡modificar de que manera???si el sitio donde lo he alojado fileden ya me da una dirección URL?¿debo cambiarla?

y la segunda pregunta que te hago es sobre lo que mencionas de colocar un script en el Head del blogg...para DewPlayer tambien es necesari????

mechas gracias santo paciencias
SIL.

Responder
JMiur  

Nada de lo de este post se corresponde con el DewPlayer así que hasta allí no hay problemas. Ese reproductor en particular, no requiere ningún script y lo que lees es para otros modelos. El DewPlayer está en esta otra entrada.

Por lo que veo en tu sitio, hay varios colocados, Todos parecen funcionar excepto uno donde me aprece que la URL al MP3 es errónea porque leo esto:

............?mp3= http://www.fileden.com/files/2008/1/20/1709581/facil &bgcolor=FFFFFF

Allí, ese espacio entre facil y el resto y el hecho que no tenga extensión podría ser el problema. No se´si es ese al que te refieres.

Responder
silpivipiapa  

gracias majo..que dios te lo page con muchos hijos y si no con muchos polvos ji ji ji
la labor que haces aqui es casi milagrosa....¡si santo job levantara la cabeza!....

SIL.

Responder
JMiur  

silpivipiapa: ¿Eso significa que se ha resuelto? :D :D

Responder
silpivipiapa  

bueno...parcialmente...

el codigo que tu me habias dicho que le faltaba la terminación mp3...ya lo he resuelto..es que se me debia de haber borrao con tanto corta y pega...pero mas abajo...intentaba volver a poner tu mismo codigo del reproductor DewPlayer y que no habia manera...quedaba en su lugar un recuadro recortado en blanco y cada vez se hacia mas grande como si fuera un agujero negro del espacio ja ja ja...pero entonces se me ha ocurrido modificarlo mirando el codigo fuente de mi blog...y borrando los
intercalados y despues de unos cuantos copy-paste mas, he conseguido quitar ese recuadro...pues al parecer al hacer COPY...habia copiado las celdillas del texto de alguna web, pero aun habiendo solucionado esto...ahora mismo en la pagina aparece la imagen del reproductor..pero...no suena....no funciona...y eso que me fui al link de donde estaba colgado el mp3 y alli si que funcionaba...¿¿¿¿????

gracias por tu noble y desinteresado interes...debes ser mu guena persona!

SIL.

Responder
JMiur  

Hay muchos en la misma página. Si me dices cuál es, me fijo a ver que dice el código fuente.

Responder
silpivipiapa  

hola Miur

el link del post es este

http://silpivipiapa.blogspot.com/2009/04/jonatanel-caballo-del-malo.html

gracias por tu tiempo
SIL.

Responder
JMiur  

El código está bien Lo que parece inccesible es el MP3:
http://elcaballodelmalo.org/ceradeoidos/polvora.mp3
Puede ser que el sitio permita descargarlo pero no ejecutarlo desde otra web.

Responder
Kike  

Y ¿como se agrega este reproductor ahora que ya no hay donde alojar archivos? perdon por la pregunta pero la verdad es que no se me ocurre como podria hacerlo. Gracias desde ya por la respuesta.
Saludos.

Responder
JMiur  

Entre otros lugares, puedes alojar archivos SWF en Fileden o en ImageShack, en ambos con cuentas gratuitas. En el primero, también pueden alojarse archivos MP3.

Responder
Kike  

Ok, muchas gracias por tu respuesta. Pero ¿esas paginas tambien aceptan el archivo .JS? Perdona por tanta pregunta :$

Responder
JMiur  

Fileden es una solución sencilla para eso. Fíjate en este post. También los scripts pueden colcoarse directamente en la plantilla sin depender de archivos externos.

Responder
Kike  

Perfecto, mil gracias por tu ayuda y tiempo para contestarme. Intentaré ponerlo en la plantilla a ver si me sale bien ;)
Saludos y gracias de nuevo. :)

Responder
JMiur  

Suerte, Kike :D

Responder
Adrián J. Messina  

Excelente reproductor, aunque no se porque no puedo hacerlo cambiar de color.
Una consulta, tengo aplicado Litebox en mi blog y lo uso para una seria de Slideshows, me gustaria acompañar estos Slides con musica de fondo, por ej, con este reproductor mientras se observan las imagenes.
Es posible?!
Espero tu respuestas y gracias!!

Responder
JMiur  

Np, para hacer eso, deberías crear algún slideshow que ya incluyera el sonido como un archivo Flash o algo similar.

Responder
Adrián J. Messina  

Tienes alguna referencia para que pueda chequear?
Gracias por la respuesta y el tiempo!

Responder
JMiur  

No, ninguna. Deberías usar Flash o algo similar. También hay servicios como Photobucket que permiten hacer ese tipo de slideshows con sonidos.

Responder
Adrián J. Messina  

Perfecto, gracias de todas formas!

Responder
q u i n o ƒ ƒ  

Funcionó!! Cambiaron de sitio el LINK, pero una vez en mis manos, seguí tus instrucciones y todo bien. Muchas gracias JMiur!

Responder
Gonzalo  

Tengo el siguiente inconveniente en la siguiente entrada

Entrada: Lo que viene

Coloqué el reproductor con un bakcground personalizado. En todos los navegadores se ve bien salvo: en IE :S (y la novedad? jaja)

Ya modifique las propiedades CSS y agregué el width (305px) y height (32px) dentro del objeto insertado pero sigue igual.

Alguna sugerencia que no sea "No uses IE"?? jaja

Gracias JMiur, cada vez saco mas provecho del blog!

..CQ..

Responder
JMiur  

Ciudad Química:
Jamás recomiendo usar un navegador u otro.

En este caso, no veo que haya ningún problema. Esta es una captura de IE8.

Responder
Gonzalo  

Ya lo solucioné poniendo de fondo una imagen con el mismo ancho y alto que tiene el SWF. :S

No encontré solución alternativa. Gracias igual!

:D

..CQ..

Responder
Anónimo  

¿Es posible insertar el reproductor SWF a kompozer? Estoy teniendo problemas con el audio mp3 del archivo local no lo puedo visualizar ni escuchar ni en mi editor web ni en el internet ya publicado es que tengo una pagina web que yo mismo diseño,atentamente gracias.
Mi sitio www.informacionyopinion.meximas.com

JMiur  

Puede ponerse en cualquier web. El MP3 y el SWF deben estar en internet, no puede ser archivos locales.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR