»• Inicio  Tutoriales Web HTML  Montar Layout Front • Crear Slides  •«

 

 Lección - 10

 

 Música y Reproductor personalizado


Descargar Materiales

Marcador (Arrastra con el ratón)

Vamos a insertar música a nuestra pagina, lo explico de dos formas, insertada y con un reproductor personalizado

Insertarla en la pagina es tan fácil como, botón derecho / propiedades de pagina

En la pestaña general veremos donde colocar el sonido, si damos a examinar buscamos la música en nuestro PC
para buscar el titulo, por ejemplo tendríamos en nuestro dominio una carpeta llamada música y otra igual en nuestro PC
inconveniente que yo le veo a esto es, que al dominio como no sean midis (y estos a veces suenan mal,) no suben
por tanto yo paso de subir música al dominio, la subo a un alojamiento que admita subir canciones,
una vez subida copio la URL de la música o canción y la pego donde veis en la captura,

Los formatos de música que yo uso son formato midi ( si tiene una calidad minima ) y formato wav, los wav suelen pesar mucho
si la música que me gusta esta en formato mp3, la convierto a wav y después reduzco peso
Podéis encontrar estos programas AQUÍ


Vamos hacer este reproductor personalizado, partiendo de esta base podéis modificarlo a vuestro gusto

Romantic Years - Enya - Anywhere Is  

En el zip de materiales va un bloc de notas con el código y el archivo en PSP del grafico, lo he puesto en capas
para que os hagáis mejor la idea de como hacer vuestro grafico, aunque también podéis usar el que mando,
el código es el mismo que tengo puesto en la portada, solo cambia el diseño de la imagen,
os explico como ponerlo en vuestra index,
este reproductor tiene una ventaja al llevar botoncitos puedes parar la música,
a veces se nos juntan varias paginas abiertas con diferentes músicas,
ósea un cacao, que nos obliga apagar el volumen de nuestros altavoces de esta forma podremos pulsar el botón y apagar,
no pasaría igual si la insertamos directamente en la pagina, como explico al principio, mientras este abierta, estará sonando

Podéis inserta el reproductor en el hueco de la x que mas os guste, yo lo puse en el ultimo, si lo ponéis en otro lugar dejar de momento libre, el espacio que señalo para el tagboard queda mejor en un sitio alto

 quitando antes la x, insertamos tabla con estos valores

Ponemos el cursor en el centro y vamos a vista código

veremos donde parpadea el cursor, suprimimos esto   y aquí mismo es donde pegamos el código del bloc

abrimos el bloc copiamos todo el código y pegamos donde esta el   

vamos a vista previa y deberá verse así

Os pongo una captura de las partes que se modifican en el código que va en el bloc, parece liadillo, pero no lo es, solo se necesita un poco de atención, voy a intentar hacéroslo fácil

Lo primero que aclaro es, si en donde esta la URL de nuestro grafico lo dejamos sin nada, solo aparecerán los botoncitos

así como veis pero sin borde, aclaro, el borde es de la captura

Ahora fijaros en lo que tenéis que modificar en el código

value= cambiar esta URL por la URL de vuestra música
background= cambiar esta URL por la URL de vuestra imagen
width= esto es el ancho de la imagen
height= esto es el alto de la imagen
( SI VUESTRA IMAGEN CAMBIA DE MEDIDAS, TENÉIS QUE REFLEJARLAS AQUÍ )
Poner texto
( EN ESTA PARTE PODÉIS ESCRIBIR LO QUE OS GUSTE , SERÁ EL TEXTO QUE SE VE CON MOVIMIENTO )
scrollamount= la velocidad de como pasa el texto
Cambiar colores a vuestra necesidad
( ESTOS SON LOS COLORES DEL TEXTO Y DE LOS BOTONES )
face= Aquí podéis cambiar la fuente y tamaño

Mirar como queda AQUI

.

 



AnteriorSubirSiguiente

Tutoriales FrontPage - Creando una Web - © Mane - 2009