domingo, 9 de febrero de 2020

Audio en una entrada de Blogger

Actualización Enero 2024

A partir de la actualización de las políticas de Google sobre seguridad y cookies, parece que el método descrito en esta entrada ya no funciona.

Añado una nueva entrada con un método que sigue funcionando, mediante la etiqueta iframe



___________________________

Podemos adjuntar audio en nuestras entradas de blogger sin necesidad de hacer uso de ningún tipo de software externo, únicamente haciendo uso de las etiquetas adecuadas de HTML5.
Para ello deberemos proceder en dos partes:

  1. Almacenar y compartir el archivo de audio en mp3 en nuestro drive
  2. Insertar el código HTML en nuestra entrada

Almacenar audio en Google drive

debemos cambiarlo a "Cualquier persona con el enlace" y pulsamos en "listo"

  • Comprobamos en la lista de archivos que ahora sale un icono que indica su estado (publico) al lado del nombre
  • Ahora le damos al archivo con el botón derecho y en le menú contextual escogemos la opcion "Obtener enlace"
  • Aparece una ventana con el enlace y automáticamente se copia este enlace al portapapeles. Podemos pegar esta dirección en un archivo de texto para mantenerla mientras hacemos los siguientes pasos.

Publicar el audio en una entrada

  • Creamos una nueva entrada, en la que podemos incluir texto, imágenes, vídeos... como en cualquier otra. Para incluir el audio, pasamos de la pestaña "Vista de redacción" a Vista en HTML


  • Veremos todo el código correspondiente al contenido de nuestra entrada, texto, imágenes...  Al final de todo el código (o en la posición en la que deseemos que aparezca el audio), copiaremos las siguientes líneas de código:



  • La dirección que hemos copiado al obtener el enlace, en el paso anterior, será parecida a:
https://drive.google.com/file/d/codigodelarchivo/view?usp=sharing
  • En las lineas que hemos puesto antes, sustituimos el código del archivo (después del igual) por el código del archivo que nos ha proporcionado google drive, sin la parte final del /view?....

Para comprobar que el código funciona, aquí tenéis un archivo de audio, el cual se puede iniciar, parar, modificar el volumen y, pulsando en los tres puntos, descargar

Tip: Si quieres poner saltos de línea para poner varios archivos de audio y escribir sus títulos, el código en HTML para el salto de linea es   </br>

7 comentarios:

  1. Mil gracias. Llevaba tiempo buscando una solución como esta. Funciona perfectamente

    ResponderEliminar
  2. hola!!! no pude publicarlo bien!!! salgo lo ewstoy haciendo mal!!! podrá ayudarme?

    ResponderEliminar
    Respuestas
    1. El codigo en tu blog parece correcto... ¿has compartido el archivo en google drive?

      Eliminar
  3. Seguí los pasos, pero al cargar el código sólo aparece el reproductor en gris, no se reproduce el audio. Cabe aclarar que compartí el archivo en Google Drive y hace un mes a lo mucho el código sí me funcionaba y sí repdroducía. Ha habido algún cambio?

    ResponderEliminar
  4. No me reproduce ni el mío ni el suyo, ¿a qué se puede deber?

    ResponderEliminar