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

• Sube a tu cuenta de google drive el archivo que deseas publicar (puede servir otro espacio de almacenamiento, como Onedrive)
• Con el botón derecho sobre el, accede a la opcion Compartir
  
  
  
• Si en la sección obtener enlace vemos la opcion "restringido" 

  

  
  

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:
  
  <audio controls=""> <source src="https://drive.google.com/uc?export=download&id=codigodelarchivo"></source> </audio>
  
  
  
• 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>