JMiur [E]

Probablemente, 1 Bit Audio Player es el reproductor de MP3s más pequeño que podamos encontrar y, una vez que lo hemos instalado, el más simple de utilizar.

Todo lo necesario para utilizarlo está en un ZIP que podemos descargar desde la página del desarrollador. Allí veremos demos, los códigos fuentes del SWF si queremos editarlo con Flash y hasta un plugin para usarlo en Wordpress. De todo eso, sólo requerimos tres cosas: la librería swfobject.js, el script 1bit.js y el reproductor 1bit.swf que debemos alojar en algún servidor.

En el caso de Blogger, se han apiadado y nos dicen que, simplemente, agreguemos lo siguiente antes de </head>:
<script type='text/javascript' src='http://1bit.markwheeler.net/1.4/swfobject.js'></script>
<script type='text/javascript' src='http://1bit.markwheeler.net/1.4/1bit.js'></script>
<script type='text/javascript'>
oneBit = new OneBit('http://1bit.markwheeler.net/1.4/1bit.swf');
oneBit.ready(function() {
oneBit.specify('background', '#FFFFFF');
oneBit.apply('a');
});
</script>

Si lo queremos usar de tanto en tanto podemos hacer lo mismo pero, en lugar de colocar el código de la plantilla, lo podemos colocar directamente en una entrada aunque ahi, deberemos escribir todo en una sola línea.

El unico dato que debemos configurar es el color de fondo que es blanco por defecto; simplemente, cambiamos #FFFFFF por el código de color que se nos ocurra 2

Ahora viene lo interesante ya que utilizarlo es tan simple como escribir un enlace donde el contenido de href será la URL del archivo MP3 a ejecutar:
<a href="URL_archivo.mp3"> texto </a>
Eso, tanto en una línea como en un párrafo:
Proin a lacus nisl, ut ultrices augue. Duis Canned Heat  tincidunt nec viverra sed, ullamcorper nec orci.
Como son enlaces, veremos el reproductor y el texto: al hacer click sobre ese texto, en logar de reproducirse podremos descrgar el archivo así que, si queremos, podemos ocultar esos textos, agregando la siguiente definición de estilo; ya sea entre etiquetas style o antes de </b:skin>:
.onebit_mp3 a {display: none;}


Aún cuando tengamos hayamos decidido ocultar los textos, siempre los podemos hacer visibles agregando el parámtreo style en la etiqueta del enlace, agregando display:inline; y cualquier otra propiedad que nos guste:
<a style="display:inline;" href="URL_archivo.mp3"> texto </a>
En esta entrada hay cuatro reproductores 1 colocados en diferentes sectores; basta hacer click sobre ellos para que comiencen a reproducirse y un nuevo click los detendrá.

30 comentarios:

javfanel  

saludos jmiur, disculpa una peticion, hace poco estaba buscando hostin, hay unos parecidos al extinto google page Como este que me parece muy bueno https://www.opendrive.com/ pero ese es para archivos lo que no vi esque diferenciaran de este tipo a los host de por ejemplo:
http://www.000webhost.com/
para blogs, sitios, etc hotgator, hosting24 etc
y aquellos que solo guardan archivos... asme un favor tu escribes chilo, crea porfa una entrada asi si te fijas no hay o las que hay estan muy pobres
me despido, saludos.

Responder
José GDF  

Justo ahora que me había decidido por el reproductor Yahoo! Media Player aparece este, que es casi tan fácil de usar...

Funciona igual que el que uso ahora, poniendo un simple enlace, ¿verdad? Entonces si alguien te enlaza un archivo de audio en los comentarios, se reproducirá también, como pasa en mi blog ahora mismo.

No hago la prueba, porque no me veo en el derecho de hacerlo... :$

Por cierto, me temo que tienes el mismo problema que yo con el de Yahoo!: los archivos alojados en Sites no reproducen en Google Chrome ni en Opera ni en IE... Sólo en Firefox y en Safari, mientras que con otros hosting me va con todos los navegadores. Parece que tiene que ver con el tema del redireccionamiento que realiza Google Sites con los archivos.

En tu caso, el primer archivo lo tienes en Fileden y el resto en Google Sites, y los dos últimos no me reproducen en los navegadores que te he dicho, sólo en Firefox y tal vez Safari (no lo puedo comprobar ahora).

¿Lo has probado con varios navegadores? Cuando detecté el problema, con la ayuda de dos amigos, opté por subir los archivos de mp3 de mi estudio a Archive.org, y me funciona a las mil maravillas con todos los navegadores. En tu caso con Fileden siempre irá bien, por lo que estoy observando.

Responder
JMiur  

No sé que buscas. Opendrive lo he probado pero no me gustó, tiene uns ervicio muy irregular; sirve apra alohjar archivos y en teoría hacer hotlink. Los otros son hostings de diferente tipo, permiten crear páginas web o blogs o incluso alojar sitios e instalar sistemas de blogs como WordPress.

Depende de para qué lo quieras usar.

Responder
JMiur  

José:
Pués no había notado eso de Google SItes. Maravilloso :D Fuera con ellos, ya los cambié. Gracias por el aviso.

Sí, funciona poniendo un simple enlace; en los comentario ... mmmm ... ahi lo dudo, habría que probar.

AUDIO MP3 Canned Heat :D

Responder
José GDF  

¡Funciona! Igualito que en el reproductor de mi blog... Siempre que no se use Google Sites, claro ;)

Responder
Gvaij  
Este comentario ha sido eliminado por el autor.
Responder
AR  

Gracias JMiur, esta bastante apañaete.
AR
Un favor, una galeria de imagenes que no sea demeasiado complicada, seria posible?
Gracias de nuevo y un saludo

Responder
JMiur  

Gvaij:
Muy útil. realmente me ha sorprendido.

AR:
Hay muchas, demasiadas :D Deberías buscar en la web para, por lo menos, tener una idea de lo que estás necesitando.

Responder
egoloco  

Naaaaaaaaaaa!!! Hasta en los comentarios??? perdón por la expresión pero... QUE HDP!!! jaja

Buenisimo... Ahora quería consultarte algo. En el enlace de los comentarios en lightwindow (sin ser el del Iframe) el efecto al abrir se me tranca :-| No se porqué. En lo demás anda barbaro: Iframe, galerías.

Responder
JMiur  

Es increible. Funciona en cualquier parte :D.

No le vi problemas al abir comentarios en tu blog ¿A que te refieres exactamente?

Responder
egoloco  

Me refería al efecto tipo blind que hace la "ventanita" al abrir. Se "desliza" cuando quiere

Responder
an//exmachina  

lo de mínimo es solo porque reproduce un solo mp3 y por el diseño?
porque yo lo veo bastante grande (casi 6 cursores de alto) :s

Responder
JMiur  

egoloco:
realmente no lo noto.

an//exmachina:
No sé a qué te refieres. El reprouctor mide 10 pixeles de alto: captura

Responder
el Zambullista  

Hola, JMiur. A mí me pasó lo mismo que a an//exmachina: el ícono me salía enorme y quebraba el párrafo. Lo solucioné copiando (en mi caso, en la plantilla) el script del readme.txt que trae el 1bit.zip descargado, donde el tamaño está especificado, y poniendo las url de los dos js y del swf que das al comienzo del post. Claro que más fácil habría sido agregarle la especifición buscada a esa versión apiadada del script:

oneBit.specify('color', '#000000');
oneBit.specify('background', '#FFFFFF');
oneBit.specify('playerSize', '10');
oneBit.specify('position', 'after');
oneBit.specify('analytics', false);
oneBit.apply('a');
});
Saludos.

Responder
JMiur  

Perfecto, el Zambullista. Como el reproductor se adapta al tamaño del texto, habría que ver por qué se ve distinto de lo que es, probablemente, lee alguna propeidad de la pagina y ahi se equivoca . De todos modos, si se solucionó, ya no importa mucho.

Otra posibilidad que probé y también aprece funcioanr, es establecer el tamaño con CSS; por ejemplo:

.onebit_mp3 embed, .onebit_mp3 object {height:10px;width:10px;}

Responder
Natalia Paola Martin Rosario Sta. Fe  

Muy buena Web!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Responder
Yarabaya  

hola antes de todo quiero agradecerles por sus consejos tan útiles, yo tengo un blog e instale este truco tengo firefox y quedo muy bien el problema es en chrome se ve un icono enorme no se como configurarlo. aquí esta mi blog: www.arequipatradicional.blogspot.com
les deseo que pasen unas felices fiestas de fin de año

saludos de Arequipa Peru

Responder
JMiur  

Yarabaya :
Prueba agregar esto al CSS:
.onebit_mp3 embed, .onebit_mp3 object {height:10px;width:10px;}

Responder
Yarabaya  

gracias por el dato si se pudo arreglar en chrome ..

Responder
Yarabaya  

quisiera comunicarle que su pagina también presenta este error en chrome , tambien se ve enorme el icono de audio mp3. también enl apágina d eun amigo que usa esta plantilla :
Blogger Template Style
Name: Watermark
Designer: Josh Peterson
URL: www.noaesthetic.com

en ese caso no aparece el CSS como se tendría que arreglar este error

agradeciendo d e antemano su amabilidad y sus buenos consejos, me despido deseándole un feliz año nuevo y muchos éxitos

Responder
JMiur  

Yarabaya:
En el post no estaba colocado el estilo así que ahora lo puse para que te fijes si ves diferencias. Ahora, lo veo bien.

En cuanto a esa plantilla, el CSS está en todas las plantillas pero si no lo ves, simplemente agregas el estilo antes de </head>:

<style>
............ lo colocas acá
</style>

Responder
MaCaPe  

Hola JMiur, hice unos cuantos intentos para añadir este reproductor, casi daba saltitos cuando lo logré, soy muy persistente o terca cuando quiero lograr algo, en mi pc todo iba bien, pero ayer quise añadirlo en "econenos" concretamente en esta entrada "Tucho Calvo falou de Valentín Paz Andrade" y funcionar funciona, pero yo no quiero que se vea la barra, dejé el número (1) para que lo veas lo que sucede, pués añadí otro reproductor, me gustaba más el minúsculo. Si no dejo ningún texto no se vé nada, en el blog de pruebas me funciona (se vé el reproductor sin necesidad de añadir texto) ¿Será incompatibilidad de scripts? Muchas gracias y disculpa por tanto consultorio. Un saludo

JMiur  

Pues no veo cuál es esa entrada, no la encuentro en el blog:
http://econenos-tics.blogspot.com/

Responder
MaCaPe  

Disculpas, no dejé la url por lo del span, pero entre tanto embrollado de blogs es difícil situarse: http://econenos.blogspot.com.es/2012/05/tucho-calvo-falou-de-valentin-paz.html,...Muchas gracias.Saludos

JMiur  

Lo que se ve son dos errores de JavaScript que podrían estar influenciando o no pero, que de todos modos deberían ser corregidos.

En el elemento HTML1 hay un traductor que tiene un script erróneo; está escrito en una sola línea y la sintaxis es equivocada.

En el elemento HTML11 se llama a una función showpageCount que no existe.

Responder
MaCaPe  

Gracias JMiur, no localizo los errores, aunque lo correcto sería decir no estoy a la altura de las circustancias,el javaScript me va un poquito grande, lo poquito que controlo lo aprendí siguiendo tus explicaciones. Dejaré el otro reproductor. Copié el traductor en el blog de pruebas y allí el pequeño reproductor funciona. Gracias de nuevo. Un saludo

JMiur  

En principio, deberías tratar de recordar para qué has agregado esos dos gadgets, el que está en HTML1 y el de HTML11. Tal vez son cosas que quedaron como residuos de alguna modificación o pruebas de algo. Ninguno de ellos funciona, no se ven en el blog por lo tanto, podrías eliminarlos por completo.

Si quieres ir a lo seguro, busca esos dos elementos en al primera pantalla de diseño, los editas, copias su contenido y guardas eso en alguna aprte y luego, los eliminas; de esa forma, eliminarás los errores y no debería haber cambios visibles en el blog ya que, como dije, no están funcionando, no hacen nada, ni siquiera son visibles.

Responder
MaCaPe  

Hola JMiur, logré hacerlo funcionar en varias plantillas, pero la de econenos se resistía, por fin lo conseguí, creo que descontrolé un poco la header right del blog, necesito un respiro, estoy bastante verde con los códigos, a penas le dedico tiempo, voy de curso en curso intentando un mínimo de formación,...El HTML1 es el traductor de las banderitas, creo que funciona,...Muchas gracias. Un saludo

Responder
dj-lexis.com  

HOLA AMIGO,TENGO UNA CUENTA EN 000WEBHOST.COM,Y LE E SUBIDO MUCHOS ARCHIVOS DE AUDIO MP3.Y QUIERO QUE ESOS ARCHIVOS SE REPRODUZCAN AUTOMATICAMENTE EN MI PAGINA WEB,ME PODRIAS DECIR,QUE REPRODUCTOR DEBO USAR.O QUE DEBO HACER PARA CUMPLIR ESE OBJETIVO?ES PARA QUE MI WEB TENGA MUSICA LAS 24HORAS SONANDO AUTOMATICAMENTE ENTREN.

JMiur  

Recomendar un reproductor no puedo. Hay muchos, varían, algunos tienen esa función, otros no. Es una elección personal.

Lo que debes tener en cuenta es que las páginas que reproducen audio de modo automático, suelen ser molestas para los visitantes y además, exigirán un carga extra del servidor que, seguramente, tiene un ancho de banda limitado y eso, te podría crear problemas o, simplemente, dejar de funcionar.

Lo mejor es dejar que sea el visitante quien decida qué quiere escuchar y cuándo quiere hacerlo.

Responder

¿Quiere dejar un comentario?

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

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

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