[TUTO#1] Reproductor de Música

Ya que alguien me pidio como coloqué la música de mi blog, se me ocurrio la idea de hacer un tutorial, creo que voy a empezar a hacer una nueva novevedad en la sección MISC como el de hacer tutoriales de los code que uso en mi blog. O ya sea que alguien me lo pida y no se lo roben o copien... xDDD...

   

Para hacer mi primer tutorial, Doramas (espero que me diga su nombre y me pase su página) me pregunto, como puse mi música en mi blog.. esté reproductor no es invencion mia ya que lo pueden encontrar en varios blogs, es un reproductor muy bonito y llamativo, además de que es muy novedoso ya que no ocupa espacio como otros ya que se esconde.

Bueno aqui vamos :D

Primero.. despues de la terminación
tienes que colocar este código..

#musicplayer {text-align: center;position: absolute; left:10px; top:-53px; -webkit-transition: all .5s ease-in-out;-moz-transition: all .5s ease-in-out;-o-transition: all .5s ease-in-out;z-index:999;}
#musicplayer:hover {top:-15px;}
#audio{background: #fff;width:230px;z-index: 9999;padding: 20px 0 5px 0;}
#musictab {height:30px;padding-top: 15px;background:#fff;border-bottom-left-radius: 5px;-moz-border-radius-bottomleft: 5px;-webkit-border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;-moz-border-radius-bottomright: 5px;-webkit-border-bottom-right-radius: 5px;width: 50px;}

Esto lo puedes editar segun como tu desees.. ya sea por el tamaño del reproductor que uses.. puedes cambiar colores de fondo en el BACKGROUND o tambien la ubicacion donde dice left y colocoas el numero de px, etc...

Luego de haber colocado eso..
tienes que colocar este código despues de

~~~~ http://ecdemo39742.cafe24.com/web/upload/bgm.gif ~~~

este es el link del gif

Puedes utilizar estas páginas de reproductores gratuitos.. yo estoy utilizando el reproductor de esta página http://www.sheepproductions.com/billy/ Como veras, tienes que colocar los links de la música que terminen en .MP3 si, no funciona.. para colocar .MP3 puedes utilizar la página de http://www.fileden.com/ o tambien de http://www.cantilux.net/

La unica diferencia de estos 2 hosting de música es que en fileden tienes que crearte una cuenta y saldrá al momento de colocar el código en el reproductor billy saldrá el nombre de la cancion.. en este caso como el mio que dice Coustic Collabo - Photos . En cambio cantilux, saldrá como nombre de la cancion números.. y no necesitas crearte una cuenta..

Otro reproductor que puedes utilizar es http://www.singingbox.org/ ... donde tienes que crearte una cuenta puedes escoger el tipo de reproductor, los colores y hasta es más facil la subida y busqueda de la musica, donde en la página principal donde dice SEARCH en rosadito y escoges la cancion.

El segundo resaltado en negrita es la imagen de las ondas de sonido, tu puedes cambiarlo al que desees.

Bueno, eso seria todo ^^..
Sorry por los por las imagenes, es que la verdad que no estoy muy familiarizada como hacer que se vean los codes completos.. asi que utilice imagenes para que se puedan guiar.. espero que haya sido de ayuda n-n


//// NO TE OLVIDES DE COLOCAR LOS CRÉDITOS CORRESPONDIENTES BITCH! //// 

pd: no me refiero BITCH a ti dorama eh~~