16. julio 2015

Reproductor para tu radio online(con imagen)

 

¿COMO PONER MI RADIO EN MI PAGINA WEB CON UN REPRODUCTOR FLASH PROPIO?

 

En este articulo les daré el codigo de los reproductores flash que estan en los ejempos de arriba para que los coloques en tu pagina web y les explicaré muy bien las sintaxis que los componen.

 

Principalmente para que tengas una radio online gratuita tienes que crearte una cuenta en alguna pagina que proporcione servidores de radio soutcast el mas común es listen2myradio el cual te proporciona un numero de PUERTO y un numero de IP  para que puedas empezar a transmitir online mediante un porgrama en tu PC como virtual dj, winamp y SAM broadcaster.

 

Si ya cuentas con tu numero de IP y PUERTO puedes empezar copiando lo siguiente:

 

<script type="text/javascript" src="https://dl.dropboxusercontent.com/u/41103817/js/swfobject.js">

</script>

 

Y vas a dirigirte a tu pagina y lo vas a pegar dentro de el head ( en jimdo inicias seción vas a AJUSTES - EDITAR HEAD y lo pegas en el espacio en blanco y das click a guardar.

 

Ahora vas a  copiar unos de los dos codigos que se encuentran debajo de acuerdo al tamaño que mas te convenga y lo vas  pegar en el body de tu pagina justo donde lo quieras ver,  el primer codigo es de tamano chico (200x200) y el segundo es mediano (400x200) asi como estan en el ejemplo de arriba.

 (En jimdo en tu pagina vas a INSERTAR NUEVO ELEMNTO- seleccionas WIDGET/HTML y das guardar)

 

Cada codigo tiene dos partes marcadas con rojo la primera son numeros y son asi:  50.22.217.113:33182  estos numeros estan separados con dos puntos ( : ) los primeros son la IP y los 5 ultimos son el puerto ahí es donde los vas a cambiar por los tuyos, la siguiente parte marcada con rojo que dice:  image.jpg  ,es donde vas a colocar la url de una imagen tuya para tu radio si has escogido el player chico tu imagen debe ser de 200 px de ancho por 180 de alto si has escogido el player mediano tu imagen debe ser de 400px de ancho por 180 de alto.

 Si quieres editarlo a otra medida ve a la parte donde dice:    '400', '200', '7'  ,  y cambia las medidas pero no cambies el numero 7, la primera cifra es el que indica el ancho, la segunda cifra indica el alto ,a la altura que le pongas siempre restale 20 px  y esa será la medida de tu imagen .

 

 tamaño chico 200x200px

 

 

<div id="player" style="height: 200px;width: 200px;margin-right: auto;margin-left: auto;">

<a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.

</div>

<script type="text/javascript">

//<![CDATA[

var so = new SWFObject('https://dl.dropboxusercontent.com/u/41103817/swf/mediaplayer.swf', 'streambaby', '200', '200', '7');

so.addVariable('type', 'mp3');

<!-- En la siguiente linea esta lo unico que debes editar, La ip y Puerto, no borres nada mas-->

so.addVariable('file', 'http://50.22.217.113:33182/;stream.nsv');

so.addVariable('autostart','true');

so.addVariable('volume','75');

so.addVariable('backcolor','0xDFDFDF');

so.addVariable('frontcolor','0x000000');

so.addVariable('lightcolor','0x333333');

so.addVariable('screencolor','0x000000');

so.addVariable('displayheight','180');

so.addVariable('image','image.jpg');

so.write('player');

//]]>

</script>

 

 

 

 

 Tamaño grande 400x200px

 

 

<div id="player" style="height: 200px;width: 400px;margin-right: auto;margin-left: auto;">

<a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.

</div>

<script type="text/javascript">

//<![CDATA[

var so = new SWFObject('https://dl.dropboxusercontent.com/u/41103817/swf/mediaplayer.swf', 'streambaby', '400', '200', '7');

so.addVariable('type', 'mp3');

<!-- En la siguiente linea esta lo unico que debes editar, La ip y Puerto, no borres stream.nsv ni nada-->

so.addVariable('file', 'http://50.22.217.113:33182/;stream.nsv');

so.addVariable('autostart','true');

so.addVariable('volume','75');

so.addVariable('backcolor','0xDFDFDF');

so.addVariable('frontcolor','0x000000');

so.addVariable('lightcolor','0x333333');

so.addVariable('screencolor','0x000000');

so.addVariable('displayheight','180');

so.addVariable('image','image.jpg');

so.write('player');

//]]>

</script>

 

 

 

 

 

las sintaxis son estas:

so.addVariable('volume','75');

      indica el volumen fijo con el que va a empezar.

so.addVariable('backcolor','0xDFDFDF');

      indica el color del reproductor.

so.addVariable('frontcolor','0x000000');

     indica el color de los numeros y simbolos.

so.addVariable('lightcolor','0x333333');

     indica el color de los numeros y simbolos al tocarlos.

so.addVariable('screencolor','0x000000');

     indica el color de fondo del reproductor(donde hemos puesto la imagen).

so.addVariable('displayheight','180');

     indica el alto de la pantalla del reproductor donde hemos puesto la imagen (debe cambiarse si se cambia el alto total del reproductor)

so.addVariable('image','image.jpg');

     indica la imagen de fondo.

 

 

 

Espero les haya gustado dejen su comentarios y dudas en la parte de abajo ,recomiendanos si te gusto visita mi canal de youtube y les dejo el link de otros articulos similares:

 

 VER EN YOUTUBE:

Reproductor flash para tu radio online 2013 shoutcast

 

Como transmitir radio online con Sam Broadcaster 2013

 

 

 

 


Etiquetas: Reproductor, musica, js, radio, online, listen2myradio

Escribir comentario

Comentarios: 1
  • #1

    Daniel Paternina Rios (domingo, 19 julio 2020 16:39)

    123