Tecnología

Inicio

Cómo incrustar un reproductor de audio de YouTube

Cómo incrustar un reproductor de audio de YouTube


Al ajustar un poco el código que se suele utilizar para incrustar un vídeo de YouTube en una página Web, puede cambiar cualquier vídeo en un reproductor de audio. El truco es reducir la altura del vídeo a 25 píxeles, lo que deja espacio para la barra de reproducción, pero elimina el video de la vista. Si va a colocar el reproductor de audio en una página HTML, es necesario utilizar los "<div>" códigos habituales y hacer algunas modificaciones para obtener la altura que necesita. Para cualquier persona que utilice un blog, como WordPress o Tumblr, el proceso es mucho más fácil.

Instrucciones

Reproductores de Audio para HTML

1 Busque el archivo HTML en su ordenador y abrirlo con su aplicación de diseño web favorito o una aplicación de edición de texto sin formato, como el Bloc de notas. Si usted no tiene una copia en su ordenador ya, abra su página Web a través del navegador, haga clic en la página y seleccione "Ver código fuente". Pulse la tecla "Ctrl + A" para seleccionar todos, entonces "Ctrl-C" para copiarlo. A continuación, puede pegarlo en un archivo TXT en blanco y guardarlo en formato TXT, cambiando la extensión de ".txt" a ".html".

2 Ir al video de YouTube que desea utilizar. Haga clic en el enlace "Compartir" debajo del video y luego haga clic en "Insertar". Haga clic en el menú "Tamaño de vídeo" y seleccionar el ancho que desea que el reproductor de audio de YouTube que sea. La anchura es la primera dimensión. Si se selecciona "560 x 315", por ejemplo, el ancho será de 560 píxeles de ancho.

3 Coloque el cursor donde desee que aparezca el reproductor de audio incrustado en su página web y pulse "Enter" para crear una nueva línea. Copia y pega la siguiente línea de código en la línea en blanco y luego vuelva a colocar la dimensión de anchura "XXX" con la dimensión que ha seleccionado en el vídeo de YouTube:

<Div style = "position: relative; anchura: XXXpx; altura: 25px; overflow: hidden;">

4 Pegue la siguiente línea de código en una nueva línea después de la última línea que ha pegado:

<Div style = "position: absolute; top: -XXXpx; izquierda: -5px">

5 Resta 25 de la altura del tamaño del vídeo de YouTube que ha seleccionado. Vuelva a colocar el "XXX" en la última línea de código con ese número. En este ejemplo, la altura es de 315px, por lo que este se convertiría en 291px.

6 Copia y pega el código siguiente en una tercera línea nueva, en sustitución del "XXX" con un ancho de su vídeo de YouTube y el "YYY", con su altura:

<Iframe width = "560" height = "315"

7 Pegue esta línea de código en una cuarta línea en el archivo HTML:

src = "https://www.youtube.com/embed/XXXX?rel=0&quot;>

8 Vuelva a colocar la "XXXX" en su línea de código con su ID de vídeo. Se trata de una serie de letras y números al final del vídeo en la barra de direcciones del navegador siguientes "watch? V =." Resaltar las letras y números después del signo "=" y copiarla pulsando la tecla "Ctrl-C". Resalta el "XXXX" en la cuarta línea de código que acaba de pegar en el archivo HTML y pulse la tecla "Ctrl-V" para sustituirlo por el ID de vídeo.

9 Añadir tres etiquetas de cierre en una quinta línea para finalizar el código: </ iframe> </ div> </ div>

10 Guarde el archivo HTML en su escritorio en formato de texto plano con el ".html" extensión usando el nombre del archivo original, como "webpage.html." Haga doble clic en el archivo en el escritorio para iniciar con su navegador de Internet. El botón de reproducción, el tiempo y el enlace de YouTube deben todos aparecen - sin embargo, el vídeo no es visible.

11 Sube el archivo HTML editado a su sitio web utilizando su aplicación favorita cliente FTP.

YouTube Reproductores de Audio para blogs

12 Busque el video que desea compartir en YouTube. Haga clic en el enlace "Compartir" debajo del video y seleccione "Insertar". Haga clic en el menú "Tamaño de vídeo" y seleccione el ancho que desea utilizar en su blog, que es la primera dimensión en la lista.

13 Resalte el código de inserción y copiarlo en el portapapeles pulsando la tecla "Ctrl-C".

14 Ingrese a su blog para editar la entrada o página en la que desea incrustar el reproductor de audio. Coloque el cursor donde desea que el reproductor de audio que aparezca y pega el código de inserción pulsando la tecla "Ctrl-V".

15 Cambiar la altura del reproductor incrustado a "25". Por ejemplo, si el código lee '<iframe width = "560", "entonces cambiar" 560 "a" 25 " Guardar o publicar el cambio y luego ir a esa página o publicar para asegurar que aparezca el reproductor de audio como usted lo desee.

Consejos y advertencias

  • Si alguien escucha su clip de audio quiere ver el video, todo lo que tienen que hacer es pulsar el enlace "YouTube" en el lado derecho de su reproductor incrustado.
  • Tratando de incrustar un reproductor de audio de YouTube en algunos sitios web, como Facebook, puede que no funcione. A partir de la publicación, tratando de cambiar la altura desactiva el enlace de aparecer.