Do you want to add audio files to your WordPress site? As a content management system, WordPress is capable of handling audio files by default. However, many beginners are not aware of this. In this article, we will show you how to add audio files and create playlists in WordPress.
Supported Audio File Formats in WordPress
WordPress uses HTML5 audio tag to embed audio files. It is compatible with most modern devices and works particularly well for mobile devices. HTML5 audio tag supports MP3, OGG, and WAV file formats.
MP3 is the most commonly used and widely supported format for audio files, and we recommend you to use it whenever possible.
Adding a Single Audio File in WordPress
Adding a single audio file or music track to any WordPress post or page is very easy. Simply click on the add media button on the post edit screen.
Next, a media uploader popup will appear on your screen. You need to click on the upload file button to select and upload your audio file. Once it’s uploaded, you need to click on insert into post button.
WordPress will insert your audio file in the post. If you are using the visual post editor, then you will be able to see the file embedded into your post. If you are using the text editor, then you will see the audio shortcode.
You can continue editing your post, or save and publish it. Once published, you can preview your post where you will see your audio file embedded like this.
Another easier way to add a single audio file is to upload the file to the media library. After that simply copy the file URL and paste it in the visual editor.
WordPress will automatically embed the URL for you. This is similar to how you embed videos in WordPress where you just paste the URL of a YouTube video and WordPress automatically embeds it.
Adding Audio Playlist in WordPress
Just like image galleries, you can also add audio playlists to your WordPress posts using the media uploader. Simply click on the add media button to upload your audio files.
After uploading your audio files, you need to select the files you want to include in the playlist and then click on create new playlist link in the left hand column.
You can now drag and drop to rearrange songs in the playlist. You can also enable the display of track name, artist name, and image. This information is embedded with your MP3 file’s IDT meta tags and is automatically displayed by WordPress.
Once you are done, simply click on the insert audio playlist button. Your playlist will be added to your post, and you will be able to see it in visual editor. You can now save your post and preview your playlist.
Editing Meta Information of Audio Files in WordPress
WordPress can automatically get the meta information from your MP3 file. However, if your file does not have any meta information, or you would like to change it, then you can do so in the media uploader.
Click on the Add Media button to launch the media uploader. You can upload your audio file or if you have already uploaded the audio file, then click on it in the Media Library.
Once the audio file is selected, you will notice the attachment details column on the right. This is where you can provide track title, artist name, album name, caption and short description for the track. This information will be displayed in the playlists and on single attachment pages.
If the audio file you uploaded has an embedded image to be used as album cover, then this image will be automatically extracted by WordPress. It will be stored in your media library and will be used when this track is added to a playlist.
However, if your audio file does not have a cover image, then you can edit the file in WordPress and upload an image. Simply go to Media » Library select the file you want to edit and click on the edit link below it.
If you are viewing the media library in grid view, then clicking on the audio file will open a popup. You can click on the Edit more details link at the bottom of the popup to edit the file.
You will now reach the edit media page, where you can not only edit all the meta information for your audio file, but you can also upload a featured image. This image will then be used when the audio file is added to a playlist.
Adding Audio Files and Playlists to Sidebar Widgets
By default WordPress does not automatically embeds audio file URLs. First we need to enable automatic embedding for text widgets, and then we need to enable shortcodes. Simply paste this code in your theme’s functions.php file or a site-specific plugin.
1 2 3 4 |
<span style="font-size: 115%; color: #000000;">add_filter( 'widget_text', array( $wp_embed, 'run_shortcode' ), 8 ); add_filter( 'widget_text', array( $wp_embed, 'autoembed'), 8 ); add_filter( 'widget_text', 'do_shortcode'); </span> |
Now you can upload a file to the media library and copy its URL. Add a text widget to WordPress sidebar and paste the URL inside it.
WordPress will automatically embed the URL into media player to play your audio file.
To add a playlist, you will need to use shortcode
with the IDs of media files you want to include into the playlist.
First you will need to upload the audio files you want to include in the playlist by visiting Media » Add New.
Now you need to edit each audio file you want to add in the playlist. Simply click on the edit link below the file in media library or click on edit more details link if you are viewing media library in the grid view.
On the Edit Media page, you will get the media file ID below the title field.
Now that you have the IDs of the file you want to add into the playlist, you can use the shortcode like this:
Don’t forget to replace the ids with your own file IDs. You can use this shortcode in a text widget. This is how it looked on our test site:
We hope this article helped you learn how to add audio files and create playlists in WordPress. You may also want to take a look at our guide on how to start a podcast with WordPress.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.