Account Details

Change your name, email, password or permanently delete your account. Change settings

We offer several ways you can get support from our experts: Support ForumKnowledgebaseNewsletter

Your Forum Posts

No posts to display.

Joomla website background music

Written by joomfreak // Friday, 22 November 2013 15:28
Joomla website background music

00jbgmusicEvery now and then, someone asks about using a background music track for their Joomla website. I don’t think this is a great idea, personally, but if you really have to, then here is a simple module for doing it quickly and easily. Let’s take a look …

First, I’ll explain why you shouldn’t set up a music track to start automatically. Think how embarrassing it would be in front of your boss or colleagues if a song kicked in at full blast when you’re in the office and you’re not supposed to be pleasing yourself on the internet. And don’t forget the size of the MP3 file that users on pay-as-you-go connections – so much per megabyte – are forced to download, whether they are interested in your backing track or not.

I realise, though, that if someone has a bee in their bonnet about a background audio file, then no arguments of mine will change their mind. So you might as well know how to set it up properly.

After various attempts, I found a cunning little module that does what we’re after – you can download it here.

I am using it on Joomla 3.1.5, but there is also a version for 2.5, which you set up in the exact same way.

Configuring the module

01jbgmusicOnce downloaded, it installs as usual from the Joomla control panel, in Extensions / Extension Manager / Install. Select the zipped file on your computer using Browse… and finally click on Upload & Install.

If we now go to Extensions / Module Manager, we can find and open the JBGMusic module; the Options tab then shows the screen that you can see here on the left.

Now we can configure the module:

- in Module Class Suffix, we can enter a suffix that will help customise the module’s appearance. The default value is _none. We can change it for one of our classes or leave it as is;

- in Audio Location, we need to specify the folder to put our audio files in. The default setting is “images”;

- in Audio File, we enter the name(s) of the file(s) that we want to run, separated by a comma if there is more than one. We can even enter an absolute URL to link to an audio file on another server. We can alternate between local files and files on another server in the same playlist;

- set Treat as Playlist? to Yes if we want to run the tracks in the order entered in the playlist. Otherwise, set it to No and the tracks will play in random order;

- set Shuffle play to Yes to reproduce the playlist as set up above;

- set Loop Music to Yes if we want to repeat the track or list once it has finished playing;

- set Hide controls? to Yes if we wish to hide the player controls;

- in Autostart audio?, select Yes if we want the track to start automatically when the page loads;

- set Autoresume audio? to Yes if we would like the track to resume playing from the point reached when the user changed page. We need that option if we want to enter a musical background track throughout the whole site or on several pages;

- in Player Type, selecting Compact or Full alters how the player appears at the front end;

- in Button Color, we give the player’s buttons the colour we prefer;

- We can leave Force Flash Player and Turn off all Alerts both set to No. The first setting would force an old version of Flash Player; the second is useful only if our audio files are not in .mp3 format;

- the Unique Key field is for entering a code that we receive after paying 10 euros to be able to remove the link to the producer’s website;

- in Temp Directory, we keep the default value.

Then we can just publish the module in a module position in our template, and we’re done.

The developer recommends installing two copies of each file for optimum browser compatibility: one with a .mp3 extension; the other, .ogg. They must have the same name: e.g. your_file.mp3 and your_file.ogg.

I have used only .mp3 audio files, which run with all the main browsers: Firefox, Chrome, and IE version 8 upwards. If you have any problems with files failing to run, let me know on the forum. If you need to convert a .mp3 file to a .ogg, you can use this program; anyway, it is also an excellent way to play any audio or video file.

And here is a demo of the JBGMusic module in action. The module has been set up exactly as illustrated above.

Additional Info

Login to post comments Blog Joomla website background music

joomfreak is not affiliated with or endorsed by the Joomla Project or Open Source Matters.
The Joomla logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.