Menu

Joomla Blog

Tutorials, reviews, case studies and other tips to help website owners and website developers master the Joomla content management system.

Simple MP3 player for Joomla

There are dozens of Joomla extensions that play MP3 files but I love Simple MP3 Bar as it is indeed simple and in many cases more than adequate. Of course MP3's are great for music but why not consider adding an audio introduction or audio instructions on your site? Your audience might appreciate hearing you rather than reading a lengthy explanation. The following instructions assume you already have an MP3 file, but if you don't, check out Audacity which is a free audio editor.

1. Download Simple MP3

2. Install the extension as normal. View Build a Joomla Website tutorial #12 to watch a demonstration of this process.

3. Upload your MP3 file(s) using Media Manager. It makes sense to create a new folder to store MP3 files so you can easily find them later.

4. This extension is a module so you need to choose an appropriate module position in your template. If you want the player to work inside an article, watch my video on how to insert a module into an article. Go to Extensions - Module Manager, find Simple MP3 Bar and click it to enter Edit mode.

5. If necessary, review Build a Joomla Website lesson #9 on modules. The important settings are:

Enabled: Yes

Position: the template position where the MP3 player should be displayed

Menu assignment: if the player is going on every page, leave this set to All. Otherwise change it to Select menu items from the list and choose the appropriate pages.

Most of the settings in the right column can be played with later but one that might throw you is Height. If you intend to play multiple files and display their names in a playlist, the height will be too small so set this to 100 for the moment and when you have it working, come back and experiment with this setting.

Quantity: if you just have one file, leave this as One. For multiple files choose Playlist.

Folder: the location of your audio file(s) e.g. images/stories/audio/

Files: your audio filename(s). In the case of multiple files, separate each one with a comma and space e.g.
file1.mp3, file2.mp3, file3.mp3

Song titles: the name of each file as you want them to appear in the playlist. As above, these need to be separated with a comma and space e.g.
My first audio file, My second audio file, My third audio file

If you run into trouble, visit the developer's site

Rate this blog entry:
Insert your content ... FAST
Google Site Search

Related Posts

 

Comments 6

Guy Merritt on Monday, 30 January 2012 14:20

I have a question. What else is new, eh...? I just spent about 4 hours putting togther a tribute site for an entertainer friend who died. I think I may join him, soon.... I presumed I should install the latest version of Joomla as it would provide the most security, features, etc (ver 2.5). Anyway, when I install this player there is no "right column" where one would normally edit the settings. I am also using PHP 5.3.3 (man - that was a huge mistake) and I know that a lot of things don't work this PHP version. I decided that I would try an earlier version of Joomla but nothing before 2.5 will install with my versions of PHP and MySql. This is one of those days when I think I need to develop a new hobby. Do the above directions, packages, etc. apply to/work with Joomla 2.5 on PHP 5.3.5?

0
I have a question. What else is new, eh...? I just spent about 4 hours putting togther a tribute site for an entertainer friend who died. I think I may join him, soon.... I presumed I should install the latest version of Joomla as it would provide the most security, features, etc (ver 2.5). Anyway, when I install this player there is no "right column" where one would normally edit the settings. I am also using PHP 5.3.3 (man - that was a huge mistake) and I know that a lot of things don't work this PHP version. I decided that I would try an earlier version of Joomla but nothing before 2.5 will install with my versions of PHP and MySql. This is one of those days when I think I need to develop a new hobby. Do the above directions, packages, etc. apply to/work with Joomla 2.5 on PHP 5.3.5?
Richard Pearce on Tuesday, 31 January 2012 08:06

It doesn't look like this was ever updated for later versions. Always check if the extension you're interesting in is compatible with your version of Joomla. You can find the full list of audio players here: http://extensions.joomla.org/extensions/multimedia/multimedia-players/audio-players-a-gallery

0
It doesn't look like this was ever updated for later versions. Always check if the extension you're interesting in is compatible with your version of Joomla. You can find the full list of audio players here: http://extensions.joomla.org/extensions/multimedia/multimedia-players/audio-players-a-gallery
Guest - Peter on Monday, 28 January 2013 09:43

Hi Richard,
Do you know of any way to embed a song in a Joomla 2.5 site, so as to have uninterrupted background music? (not affected by navigating from page to page)
Thanks,
Peter

0
Hi Richard, Do you know of any way to embed a song in a Joomla 2.5 site, so as to have uninterrupted background music? (not affected by navigating from page to page) Thanks, Peter
Richard Pearce on Wednesday, 30 January 2013 08:02

This is an "old" web development question and as far as I am aware, there is only one effective solution, which is far from ideal. You need to create the site using what's called "frames". If you're not familiar with this, it's a little hard to explain. There are two pages joined together by these frames. As visitors navigate through the site, the top frame changes. But the bottom frame stays the same and it is this one that contains the audio player. As that frame does not change, the audio continues to play. However frames are considered to be a pain. Again this is hard to explain but one problem lies with search engines. They will index the individual pages, not the framed page. So the visitor doesn't arrive at your desired location and misses the audio. You can get around this with JavaScript that detects the frame isn't loaded and then reloads the page, but this isn't something for beginners.

The other solution used to be to build the entire site using Flash, but iOS has pretty much killed that option. Flash does not work on the millions of iPhones and iPads that have been sold. We used to do this a lot when creating band sites years ago.

These days most music orientated sites have a media page that contains audio and possibly video. The experience of playing music throughout a site visit has never worked well so I encourage you to rethink the need for this.

0
This is an "old" web development question and as far as I am aware, there is only one effective solution, which is far from ideal. You need to create the site using what's called "frames". If you're not familiar with this, it's a little hard to explain. There are two pages joined together by these frames. As visitors navigate through the site, the top frame changes. But the bottom frame stays the same and it is this one that contains the audio player. As that frame does not change, the audio continues to play. However frames are considered to be a pain. Again this is hard to explain but one problem lies with search engines. They will index the individual pages, not the framed page. So the visitor doesn't arrive at your desired location and misses the audio. You can get around this with JavaScript that detects the frame isn't loaded and then reloads the page, but this isn't something for beginners. The other solution used to be to build the entire site using Flash, but iOS has pretty much killed that option. Flash does not work on the millions of iPhones and iPads that have been sold. We used to do this a lot when creating band sites years ago. These days most music orientated sites have a media page that contains audio and possibly video. The experience of playing music throughout a site visit has never worked well so I encourage you to rethink the need for this.
Guest - eddyahmad on Tuesday, 29 January 2013 23:57

Hi richard, i've install it, but the moment i click play instead of playing the song it pop up ask download this mp3. May i know the solution of this.

This is my file directories

C:/Program Files/xampp/htdocs/mgm3191/images/music/

0
Hi richard, i've install it, but the moment i click play instead of playing the song it pop up ask download this mp3. May i know the solution of this. This is my file directories C:/Program Files/xampp/htdocs/mgm3191/images/music/
Richard Pearce on Wednesday, 30 January 2013 07:03

Have you tried it on a live website instead of locally? You can sometimes get unwanted results when developing locally. It could have something to do with what's called MIME types.

Otherwise you might like to ask the developer.

0
Have you tried it on a live website instead of locally? You can sometimes get unwanted results when developing locally. It could have something to do with what's called MIME types. Otherwise you might like to ask the developer.

Free Joomla TutorialLearn Joomla for free with our 16 lesson, 2 hour course.

Get Started