What's WP
Find Everything Related to WordPress - Best Tutoriasl on WordPress!
How to Add and Play Music in WordPress

How to Add and Play Music in WordPress

Now, music has a huge impact on people‚Äôs lives. In this case, many webmasters choose to play the music on their websites to better enrich the web content and to effectively convey their ideas and thoughts. In the following, we’d like to introduce two simple methods of how to add and play music in WordPress.

Here, we need to mention that this special web content is not only limited to some band sites or music related websites. Instead, you can play the music on whatever situation it is. For instance, you may want to share what you have listened with your visitors. Or, you just want to play the sound for the better mood of your site. No matter what reason is, you can check the following to learn the detailed steps for doing so.

Option 1 – Utilize the Compact WP Audio Player Plugin

There are a lot of WordPress music player plugins you can use to add and play music on your site. Among all the available options, we think the Compact WP Audio Player is the simplest one to use. This plugin works based on Flash Hybrid and HTML5. With it, you can embed the MP3 audio files into your WordPress posts and pages simply via a shortcode. Note that the audio player is small and cute, which will not influence your webpage design and style. In addition, this plugin is compatible with all the major viewing devices and browsers.

To use this plugin, you can add the music directly, without the need to set up for its working. For this, you can use the critical shortcode as the following.

Compact WP Audio Player Shortcode

In the most basic situation, you only need to use the first line of coding stuff and enter the file URL of your target music. This way, the music player will look like as below.

Basic Music Player

In addition, you can also start an automatic playing for the music once people load this page, decide the default volume for playing and enable the loops using the middle three lines of code. Even, you can display the inline text on the music player using the fifth line of the shortcode.

As for the last shortcode, you can change the display style of the music player just like the below sample.

Compact WP Audio Player Template

Option 2 – Utilize the HTML5 Audio Player Plugin

Unlike the first plugin that gives you a simple music player, the HTML5 Audio Player plugin ensures a trendy looking that allows you to embed the single music track or the full music playlist on your posts or pages. It works fine on all the modern browsers and devices without the compatibility concern.

Determine the HTML5 Player Display Settings

Now, after the plugin installation, you should click the HTML5 Player tab, and then, hit the Display Settings button.

HTML5 Player Display Settings

As this plugin allows you to sell the music you have added and played, here, you can choose to showcase the Buy text or not. Also, you have the freedom to enter the exact button label for buying, along with the currency symbol.

Next, you need to determine whether to show the track list and the maximum number of tracks that can be showcased in one time. This part is pretty important if you are looking to embed and to play multiple songs or audio files one by one on a single page. Here, we need to mention that if the number of files exceeds the maximum limit of tracks, the player will show you a View More button.

Lastly, for the better display of the music player, you’d better choose the exact background color and the text color. Here, your selection should match the overall style of your webpage.

Manage the Music, Songs and Audio Files

After determining how the music player can be displayed, now, you need to click the Manage Songs button for the better music management.

To begin with, you need to upload the full path of the music files. Note that this plugin only supports the MP3 and the ogg file formats.

Manage Songs

In addition, you can add the rating information of the music if want. The rating stars come from 1 to 5. Even, you can add the much more detailed information about the music.

  • You can enter the title of the music.
  • You can upload the image that acts as the cover image for each song. Note that the recommended dimension of the image is 125 in pixels.
  • You can enter the exact duration of the music.
  • You can offer the artist name of the song as you want.

Besides, if you decide to sell the music, you also need to enter the precise charging of the song, along with the link to make the purchase.

Now, you can click the Add Song button. Also, you can repeat these steps to embed multiple audio files as you want.

Play Music in WordPress

Now, you can play music on your WordPress posts using the following shortcode.

HTML5 Player Shortcode

And your music can be played in the following way.

HTML5 Player


Susan Rose is a freelance writer who has a deep knowledge about WordPress. She loves everything related to website building since the freshman year at Christopher Newport University, and loves to share her experience with people all over all the world. In the daily life, Susan loves detective novels as it can train her logical thinking and creativity.