Recibimos una pregunta interesante la semana pasada aquí en TechJunkie Towers. Consideraba algo que nunca antes había considerado y quería saber cómo incrustar audio MP3 en una página web con Google Drive. Como alguien que administra una serie de sitios web para organizaciones, la pregunta me fue respondida.
Por lo general, alojaría cualquier medio junto al sitio web si quisiera incluirlo en una página. Mantiene las cosas ordenadas y reduce la cantidad de consultas externas que su página web tiene que hacer mientras se carga. Sin embargo, esa no es la única forma de hacer las cosas y si, por alguna razón, no puede alojar su audio junto con su sitio web, puede usar Google Drive u otro servicio en la nube para alojarlo y vincularlo a su página web.
Si bien este tutorial aborda la inserción en una página web, el mismo principio se aplica a la mayoría de las páginas en línea. Eso puede incluir redes sociales, blogs, wikis, páginas de destino o lo que sea.
Incruste audio en una página web con Google Drive
Para incrustar audio en una página web, normalmente cargamos el archivo MP3 en el servidor web y lo colocamos en línea en la página. Esto permite que la página consulte al host y reproduzca la música rápidamente y sin más consultas externas. Eso no siempre es posible. Si no tiene la capacidad de almacenamiento de espacio en su host web o el host no es muy rápido o adecuado para la transmisión, debe buscar en otro lado.
Ahí es donde entra en juego Google Drive u otro servicio en la nube. Puede cargar el MP3 al almacenamiento en la nube y vincularlo desde su página web. Luego, cada vez que alguien reproduce la pista, transmite desde su Drive en lugar de hacerlo localmente en su servidor web. Dado lo grandes y poderosos que son los servidores en la nube de Google, ¡también puedes usar eso para tu ventaja!
Aquí se explica cómo configurarlo:
- Inicie sesión en su Google Drive como de costumbre.
- Cree una carpeta y cargue el archivo MP3 en ella.
- Establezca el permiso para el archivo MP3 en 'En - Público en la web, cualquier persona en Internet puede encontrarlo y verlo'.
- Guarda el permiso.
- Capture el enlace para compartir en la página Compartir. Comenzará 'https://drive.google./com/…'
Eso es todo por configurar. Su archivo MP3 está ahora en la nube y cualquier persona con el enlace para compartir puede acceder a él. Ahora necesitamos colocar ese enlace en línea en su página web para que otros puedan acceder a él.
Insertar el enlace en tu página
Exactamente cómo incrustar el enlace compartido depende de lo que use para su sitio web. Puede usar un método diferente para WordPress o Joomla como lo haría para HTML u otros marcos.
Para incrustar su MP3 en una página de WordPress:
- Abra su página en WordPress y haga un espacio para el archivo de audio.
- Seleccione el botón Agregar medios en la parte superior del editor de páginas.
- Seleccione Introducir URL y pegue la URL de Google Drive desde arriba.
- Déle un nombre y un título y luego inserte medios.
- Guarde la página una vez hecho.
Si obtiene una vista previa de la página, ahora debería ver el enlace y su descripción agregada donde la colocó en la página. Reproduzca los medios y se transmitirá de manera invisible desde su Google Drive a través de la página. Es una forma muy ordenada de agregar medios enriquecidos a una página sin utilizar el almacenamiento en su servidor web.
Si no usa WordPress y necesita incrustar el código dentro de un iFrame, eso también es muy sencillo. Como iFrames es un estándar web, la mayoría de los frameworks y plataformas de publicación deberían admitirlos. Entonces, todo lo que necesita hacer es crear el iFrame y colocarlo en su página.
Para incrustar su archivo MP3 usando otros marcos:
- Pegue la URL compartida de Google Drive en un editor de texto.
- Cambie '/ view' al final de la URL por '/ preview' y copie la URL completa.
- Pégalo en el siguiente código en lugar de la URL de ejemplo después de 'src ='.
- Abra su página web en un editor HTML o use el editor de su plataforma.
- Coloque el código completo, incluido el en su página donde desea que aparezca.
- Guarde el archivo y pruébelo.
El código:
frameborder = "0" width = "500" height = "250" src = "https://drive.google.com/file/d/MP3FILEURL/preview">
El reproductor debería aparecer en su página y reproducir el archivo MP3 cuando se seleccione. Asegúrese de revisar el enlace usted mismo una vez cargado para asegurarse de que funciona. ¡Luego publica la página modificada y disfruta!
Así es como incrustar audio MP3 en una página web con Google Drive. ¿Conoces alguna otra forma de hacerlo? ¡Cuéntanos más abajo si lo haces!
