[GUIA] Reproductor de musica mientras navegas.

Hola de nuevo, antes de ayer me encontre con un tema donde pedian colocar un reproductor de musica usando Frames, el problema era que no sabian como hacerlo.
Asi que decidi investigar sobre el tema y la verdad no es del otro mundo, no es sencillo pero tampoco muy dificil.

Entonces voy a explicar que es lo que queremos lograr y como hacerlo, mas alla de explicar que son las frames, esta de más ya que en google existen infinidades de definiciones que lo podran explicar mejor que yo.

Resumen: Lo que vamos hacer es colocar dos paginas en una, el primero que sera nuestro reproductor de musica y el otro que sera nuestra pagina con el contenido.




Paso 1. Necesitamos 2 paginas la primera sera nuestro reproductor y la segunda nuestro foro que contiene todos los enlaces que nos permitira navegar.
Dentro del zip que dejare adjunto viene un archivo llamado index.html este archivo lo abrimos con algun editor, les recomiendo el Notepad++ un excelente editor avanzado, si no, pueden usar el Wordpad que se encuentra en la carpeta accesorios de la pagina de inicio. listo una vez lo tengan abierto hiremos editando lo que nos pide.

Código HTML:

<title>Nombre de tu foro</title>

Código HTML:

<meta name='generator' content='Powered by vBulletin™ Version 3.8' />

Aqui colocan la version de su foro.

Código HTML:

<meta name='classification' content='juegos' />

Aqui colocan de que es su foro, por ejemplo si es un foro de warez, le colocan "warez", si es un foro de video juegos, le colocan "video juegos", etc...

Código HTML:

<meta name='description' content='Descripcion de tu foro.' />

Coloca de que trata tu foro, una descripcion de este.

Código HTML:

<meta name='keywords' content='tags de tu foro, ejemplo: juegos, musica, webmaster, descargas.' />

Aqui colocan los tags con referencia a su foro. coloquen lo que mas puedan para tener una mayor indexacion con los motores de busqueda.

Código HTML:

<meta name='DC.title' content='nombredeforo.cl' />

Aqui el nombre de su dominio, ejemplo "musica.com".

Código HTML:

<link REL="SHORTCUT ICON" HREF="http://www.nombredetuforo.cl/favicon.ico">

La direccion o ruta de tu favicon.

Código HTML:

<frame src="http://www.nombredetuforo.cl/player.html" name="FrameDeCima" id="FrameDeCima" scrolling="no" />

Colocan el nombre o la direcion de su foro que contendra nuestro reproductor.

Código HTML:

<frame src="http://www.nombredetuforo.cl/portal.php" name="mainFrame" id="mainFrame" />

Si no tienes portal le colocas.

Código HTML:

<frame src="http://www.nombredetuforo.cl/foro.php" name="mainFrame" id="mainFrame" />

Este es el paso mas importante, todos las paginas tienen como entrada una archivo llamado index.php pero lo que queremos es que nuestra pagina de inicio sea nuestra pagina con las Frames.
Entonces renombramos nuestro index actual (ojo, no el que estamos colocando la informacion)
Entramos en nuestro FTP y buscamos en el directorio, el archivo llamado index.php, si tu foro tiene el portal como pagina index le colocamos portal.php, si no tienes portal lo nombraras como foro.php.
Entonces lo que queremos es que cuando entremos a nuestra pagina no entre por index.php si no que por el index.html que es el que estamos editando.

ya terminado guardamos todos los cambios.


PASO 2. Sube al directorio de tu foro los archivos llamados index.html, player.html, pv2.css, pv2.js y sube las imagenes a la carpeta images.

Dentro de la carpeta images viene una imagen llamada logo.jpg el cual la pueden editar y colocarle el nombre de su foro, o lo que deseén.

Listo ya tenemos nuestra pagina con Frames.


PASO 3. Ahora si dentro de tu foro tienes algun enlace dirigiendo al index.php editalo ya que esa direccion ya no existe.

Si el index.php lo tienes en el logo haz lo sig.
Nota: Los que no tengan como index al logo saltar este paso.

Entra a tu AdminCp -> Opciones de vbulletin -> Opciones de vbulletin y busca Opciones de la Página de Inicio del Foro donde dice Nombre de Archivo Para la Página de Inicio si te dice index cambialo por foro o portal como deseés. y guardas.


Listo ya tenemos todo funcional.

Paso a aclarar varios puntos importantes.

No dejes algun enlace en el foro dirigiendo al index.html o a www.tusitio.com ya que al esta navegando con las frames y al hacerle click solo hiras abriendo mas reproductores.

Esta Guia sirve para todas las versiones de vBulletin, ya que es solo HTML.

El reproductor actual esta configurado con una emisora chilena llamada Radio Concierto la voz de los 80´

¿Como coloco una radio que me guste?

Paso aclarar que el reproductor tuve que hacerlo yo, porque todas las radios tienen reproductores diferentes con logos grandes y publicidad que no queremos en nuestro foro.

Entonces para compartir gustos en musica y emisoras de radios, el cual le pedi permiso a Chuta.
Quien deseé cambiar la radio que viene por "defecto" en las respuestas coloque la direccion de la radio que desean, luego de revisarlo y editar solo tienen que subir el archivo llamado player.html el cual contiene el reproductor y la emisora.

Nota: No se aceptaran enlaces que irrumpan las normas de vBHispano.


Si no deseas tener ayuda en el paso de colocar la emisora que quieres puedes hacerlo de la siguiente manera.

Editas el archivo llamado player.html dentro busca src= seguido de esto colocan el src de la emisora que deseas.
Para encontrar una src de una radio entras a la radio donde esta el reproductor haces click con el boton derecho en la pagina y clickea Ver Codigo Fuente de la pagina dentro busca el src= seguido de esto esta la direccion de tu radio.


Para terminar debo decir que el reproductor aunque sea de windows no es compatible con el Internet Explorer, con todos los demas navegadores funciona sin ningun problema.
Talvez no tenia algo instalado en el IE que no me funciono pero corregirme si funciona en el IE.

Como siempre aclarar que esta guia esta hecha por mi persona y no infringe ningun derecho de autor.

Dudas y preguntas las hire contestando en las respuestas.

Gracias por su atencion y nos veremos en una proxima guia.

Saludos y Suerte!