HTML Audio Player not working

Good afternoon!

I’m trying to embed an HTML5 audio player into my page for some mp3s. The audio player shows up, but seems empty (play doesn’t work and the time stays at 0). I’ve uploaded the MP3 in question to the files section of the panel. Here’s my code:

<audio controls>
  <source src="apparemment.mp3" type="audio/mp3">
  <source src="myAudio.ogg" type="audio/ogg">
  <p>Your browser doesn't support HTML5 audio. Here is
     a <a href="apparemment.mp3">link to the audio</a> instead.</p>

How can I solve this?

Thanks for your help!


Check whether the file path is correct. What does the template PHP code for the file path look like? Also, if you don’t provide an OGG file you should remove the source element for that (because it looks like you just copy/pasted that from somewhere).

1 Like

Replace the filename in the src attribute with the url of the file.


<?php if ($file = $page->file('apparemment.mp3')): ?>
<audio controls>
  <source src="<?= $file->url() ?>" type="<?= $file->mime()">
  <p>Your browser doesn't support HTML5 audio.</p>
<?php endif ?>
1 Like

Should’ve thought of that! I figured it would find the file on the page. Thanks a bunch!