« Web, HTML, Tech Forum

HTML online playlist as an audio source?

Posted by Motya

posted

Forum: Web, HTML, Tech

I should probably ask in like a dedicated html/old web forum and not spacehey but. here i am

I want to put an audio player on my site. I have one already on my neocities, and the code is laid out like this basically:

<div>
        <img id="player" src="PNG"
        onclick="buttonClick()">
  </div>
    
  <audio id="audio" loop>
    <source src="THIS IS WHAT I WANNA KNOW ABOUT :(">
  </audio>
 
<script>
      function buttonClick() {
        document.getElementById('audio').play();
        document.getElementById('player').onclick = notButtonClick;
      }
      function notButtonClick() {
        document.getElementById('audio').pause();
        document.getElementById('player').onclick = buttonClick;
      }
 </script>


not too complicated i don't think. but i don't want to have to download an individual mp3 for each song and upload them one-by-one, I'd rather have like a playlist hosted somewhere that I can just swap songs out of and have them automatically update on my site. afaik though the only src you can put in an <audio> tag though is mp3 (or whatever the fuck ogg is), is there some way i can re-work this to make it link to some other site or link to a collection of mp3s somehow?


Report Topic

5 Replies

Sort Replies:

Reply by Code/L0gic

posted

I don't know it's what you need, but you could use a Spotify playlist, Spotify automatically generates the code to add the playlist to the page so it would just be copy and paste 


Permalink Report Reply

Reply by Motya

posted

does it just open spotify within the page itself, like an iframe?


Permalink Report Reply

Reply by turnerscarlet22

posted

I read that the standard <audio> tag only works with direct links to mp3 files, and you can’t connect a whole playlist directly. I’ve seen solutions using third-party services like Soundcloud or Spotify, where you can embed a playlist with an iframe, but then it opens not as a regular audio player of the site. If you want the playlist to update automatically, probably the easiest way is to use the embed code from these platforms.


Permalink Report Reply

Reply by Motya

posted

wow this is ancient. i eventually figured that out but i appreciate the reply even though this is over a year old, props


Permalink Report Reply

Reply by yimis

posted
updated

I read that the standard <audio> tag only works with direct links to mp3 files, and you can’t connect a whole playlist directly. I’ve seen solutions using third-party services like Soundcloud or Spotify, where you can embed a playlist with an iframe, but then it opens not as a regular audio player of the site. If you want the playlist to update automatically, probably the easiest way is to use the embed code from these platforms. Of course, if you’re working with documentation or manuals, you might use specialized tools like https://www.helpsmith.com, which is designed for creating and managing documentation, not audio content.



I agree that with the standard audio tag, it’s only convenient if you have direct links to mp3s, and making an automatically updating playlist only works through third-party services. I’ve also seen solutions with iframes, but then you don’t get the feeling of a built-in audio player. I think it’s really easier to use the embed code if automation is important.


Permalink Report Reply