Friday, February 16, 2024

Hosting Audio on Drive

You can upload images to Blogger, and video too (though you might be better off using YouTube).

Realistic painting of a dog with head cocked at the mouth of an old-fashioned victrola
francis barraud

But there is no provision in Blogger for hosting audio.

You can still host audio files at Drive, though it recently got harder to do. I've got a solution that formats a valid embed from Drive as a basic audio player:

If you set something like this up in the past, you should check to make sure it's still working.

Older embeds are affected by the same change at Google Drive that has screwed up images in blogs for people who hosted them there rather than in Blogger.

The following work flow will work today.

  1. Put a placeholder "xx" in your blog post where you want to insert the player, and then switch into HTML mode.
  2. Replace the "xx" placeholder with this code snippet, which you will further edit:

    <div style="height: 40px; max-width: 100%; overflow: hidden; width: 500px;">
    <iframe allow="autoplay" height="480" src="[FILE ID CODE]/preview" style="left: -150px; position: relative; top: -222px;" width="640"></iframe>

  3. Locate the audio file in Drive, and confirm that it is playable.
  4. Share it with "anyone with the link."
  5. Copy the shared link and locate in it the unique identifier (a long random string of characters after "/file/d/")
  6. Copy the identifier and paste it in the indicated spot ([FILE ID CODE]) in the code snippet.

    You can switch back into Compose mode after that. Check it in Preview.

    That code should format the embed as a basic player that adapts to most widths. You can modify all those formatting parameters if you like, but you probably won't need to.

    The color scheme is, alas, not negotiable.

    This should hold until the next time Google breaks something.

    The painting His Master's Voice is associated with the early days of recorded sound. It is in the public domain.


    1. I prefer to insert the audio as a video file directly into Blogger, so nothing is deducted from my Drive storage.

      1. Some bloggers have an installed base of audio on Drive, and those embeds are now broken. This post tells them how to fix that.

        Your solution is worth considering for precisely the reason you mention, if it is technically within reach. How do you convert audio to video?

      2. The same way you do it on YouTube. There are many tutorials, ser onde:

      3. That refers to a web-based video-editing program that will let someone save a sound file as an MP4 (video format) after some modifications. It is certainly worth knowing about that.

    2. Much appreciated - things all seem to be working again, thanks to your work.