The audio block allows you to embed audio files into your webpage. To get started with the audio block use the + button to add a new block and select audio. This will add the audio block to your page and give you the option to upload an audio file, use an audio file from your media library, or insert an audio file by pasting in a URL of an audio file hosted elsewhere. All three of these options are good options but make sure if you are using an audio file hosted elsewhere that you have permission to do so. We have screenshot the empty audio block below. Once you have added an audio file and your block no longer looks like the screenshot below you can carry on past it to learn more about a few of the block settings.
With your audio added, you can add a caption to the audio player so your users know what the audio file is before playing it by clicking “Write caption…” and typing in your caption.
Once your audio file has a caption you can look under audio settings in the block options menu to tweak a couple of other settings. We have outlined audio settings in the screenshot below.
The options you have when it comes to audio settings are to set your audio to auto-play when users reach the page (think the theme song on your Myspace profile page from 2004). Generally, it is not a good idea to have audio autoplay so this is turned off by default but you can click the toggle to turn it on. The other toggle sets your audio to loop (play again when it’s done) this is also set to off by default but you can switch it on if that makes sense for your audio.
Lastly, there is a dropdown labeled “preload” which defaults to none, meaning that nothing is preloaded. You can set this to “Auto” or “Metadata”. “Auto” will make it so that the full audio file is downloaded when the user loads the page and this is not recommended as audio files are large and will lead to slow page load times. Metadata will make it so that some of the information about the audio file is downloaded when the page loads but not the full file itself. Usually, none or metadata are the best options here.
That’s all for the audio block. For help with other blocks, check out the full list of blocks we have guides on here.
« The Classic Editor Block