Make A Free Audio Player

Nathan Puls
1 min readJan 20, 2021

The web can be a tough place to build things at times. It can be a bit like the wild west. Fortunately, my curiosity and interest in creating has led me to persevere and find a way to accomplish a variety of goals. One such goal was to make an audio player for my voice over website sayingthings.com.

TL;DR

Convert your Google Audio file so Google Drive can host your audio while your website audio player can play it.

Alternatively use my spreadsheet to convert your Google Audio files.

(***I also have one for Images***).

You can use any html player but two good options are:

#1 W3 Schools for the native audio element

<audio controls>
<source src=”horse.ogg” type=”audio/ogg”> DELETE THIS LINE
<source src=”horse.mp3" type=”audio/mpeg”> REPLACE HORSE.MP3 WITH
YOUR CONVERTED AUDIO URL
Your browser does not support the audio element.
</audio>

#2 A custom audio player like the one I edited

The Original (on Codepen)

My AudioPlayer (on Codepen)

Stackflow is where I discovered what I needed to do to convert mp3 files.

Don’t forget to let me know how it goes! Drop me a line

--

--