FANDOM


Actualización: si deseas incluir el audio de un vídeo de YouTube, simplemente utiliza la plantilla YouTube-audio, es más fácil de usar y no requiere pasos adicionales.


¡Saludos!

En el día de hoy, os mostraré algo que tal vez muchos no sepáis, que consiste en un pequeño tutorial para insertar música en la página de usuario, utilizando la nueva etiqueda HTML5 <audio>.

He notado que muchos usuarios usan la Plantilla:MPC para poner música en su perfil, lo cual no está mal, pero no es recomendable, ya que a esa plantilla no se le pueden poner controles, y no habría manera de parar la música, además de que al usar YouTube, el navegador descarga además del audio, el vídeo, cuando en realidad no lo estamos viendo, así que además es un gasto innecesario de internet para quien vaya a dicho perfil.

La nueva etiqueta HTML5 <audio>, la cual fue añadida en la actualización de julio, es más rápida y ahorra más ancho de banda comparada con MPC, ya que sólo procesa audio, y no vídeo,

Para utilizar la etiqueta HTML5 <audio>, debemos seguir los siguientes pasos:

1. Lo primero que debemos determinar es dónde subiremos el archivo de audio. Lo recomendado es subirlo a Dropbox o a Google Drive. También es posible subirlo a Wikia, sin embargo esto no es recomendado ya que los archivos subidos a Wikia son borrados pasado cierto tiempo.

2. También necesitaremos, el archivo de audio que vamos a colocar. Para subirlo a Dropbox o Drive puedes utilizar los formatos MP3, OGG y WAV. Si vamos a subir el archivo a Wikia, lo necesitaremos obligatoriamente en formato OGG. Con este conversor online se pueden convertir archivos de otro formato a OGG.

A partir de aquí, el procedimiento cambia según dónde hayamos elegido cargar el archivo.

3. Teniendo el archivo de audio, lo cargamos a Dropbox haciendo clic en el botón "subir archivo" y seleccionando el archivo. Una vez que el archivo se haya subido, debemos hacer clic en el botón "compartir" que se puede encontrar a la derecha del archivo, o también haciendo clic derecho en el mismo.

4. En la ventana de "compartir" debemos seleccionar crear un vínculo. El vínculo será similar a este: https://www.dropbox.com/s/sre0ohp4w3b2ex4/archivo.mp3?dl=0. Simplemente debemos reemplazar en la última parte, el ?dl=0 por ?dl=1. Una vez hecho esto, ese es el enlace directo que necesitamos.

3. Teniendo el archivo de audio, hacemos clic en "nuevo -> subir archivo" en la esquina superior izquierda de Google Drive. Con el archivo ya subido, debemos hacer clic derecho en él y seleccionar "compartir". En la ventana que se abrirá, seleccionamos "crear enlace para compartir", en la esquina superior derecha, y copiamos el enlace.

4. Debemos dirigirnos a https://sites.google.com/site/gdocs2direct/, pegar el enlace que hemos obtenido en el paso 3, y hacer clic en "create direct link". Esto generará un "output link", que es el enlace directo que necesitamos para esto.

3. Teniendo el archivo OGG, debemos de subirlo a Wikia mediante la página Especial:SubirArchivo. Puede ser en este wiki, o en cualquier otro wiki. A modo de ejemplo, he subido el tema extendido de SU aquí: Archivo:Steven Universe - Extended Intro.ogg

Screenshot 9001
4. Ahora, debemos dirigirnos a la página del archivo que acabamos de subir, y hacer clic derecho en el enlace inferior (el cual está marcado con una flecha), y selecionar "copiar dirección de enlace/copiar ruta del enlace". Este es el enlace directo que necesitaremos.


5. Teniendo el enlace directo que hemos obtenido en el paso 4, ya se puede utilizar. Donde se quiera que aparezca el audio, se debe insertar este código:

<div class="audio" style="text-align:center" data-options="autoplay controls" data-src="aquí va la URL" data-type="audio/ogg"></div>

Cambiando donde dice "aquí va la URL" por la URL que hemos copiado.

Por ejemplo, para insertar el intro extendido de SU que he subido como ejemplo, el código sería el siguiente:

<div class="audio" style="text-align:center" data-options="autoplay controls" data-src="
http://vignette2.wikia.nocookie.net/universosteven/images/6/60/Steven_Universe_-_Extended_Intro.ogg/revision/latest?cb=20160827203454&path-prefix=es" data-type="audio/ogg"></div>

Lo cual, nos daría el siguiente resultado:

 


Eso ha sido todo, he intentado ser lo más claro posible, pero de todos modos, si tenéis alguna pregunta, dejadla en los comentarios. :v

Despidos. (?)

20:59 27 ago 2016 (UTC)
El contenido de la comunidad está disponible bajo CC-BY-SA a menos que se indique lo contrario.