If your web server supports a server-side script, for example PHP, you can pass a URL parameter to the player webpage, then play different mp3 files according to the URL parameter.
This is useful when you use iframe to add players to a webpage and you want to use the same player to play different mp3 files.
Continue reading
This tutorial will show you how to add an audio player created with Amazing Audio Player and a slideshow created with Amazing Slider to the same webpage.
There are three steps in this tutorial:
This tutorial will show you how to add a button to shuffle the playlist of the audio player.
Step 1 – In your webpage, add the following HTML code to create a button. You could use your own CSS to add style to the button.
<button id="shuffle-player">Shuffle</button>
Step 2 – In your webpage, add the following JavaScript to your webpage, just before the head closing tag </head>.
In the code, line 6, if your player has a different ID, please change the value accordingly.
<script>
(function($) {
$("document").ready(function() {
$("#shuffle-player").click(function() {
var playerID = 1;
var instance = $("#amazingaudioplayer-" + playerID).data("object");
for (var i = instance.elemLength - 1; i > 0; i--)
{
if ((i == 1) && (Math.random() < 0.5))
break;
var index = Math.floor(Math.random() * i);
var temp = instance.elemArray[index];
instance.elemArray[index] = instance.elemArray[i];
instance.elemArray[i] = temp;
temp = instance.playerSkin.trackitems[index];
instance.playerSkin.trackitems[index] = instance.playerSkin.trackitems[i];
instance.playerSkin.trackitems[i] = temp;
var tracks = $("#amazingaudioplayer-" + playerID + " .amazingaudioplayer-track-item");
var track0 = tracks.eq(index);
var track1 = tracks.eq(i);
track0.insertBefore(track1);
tracks = $("#amazingaudioplayer-" + playerID + " .amazingaudioplayer-track-item");
track1.insertBefore(tracks.eq(index));
}
for (var i = 0; i< instance.elemLength; i++)
instance.elemArray[i].id = i + 1;
$("#amazingaudioplayer-" + playerID + " .amazingaudioplayer-track-item").each(function(i) {
$(this).data("order", i);
if ($(this).hasClass("amazingaudioplayer-track-item-active"))
instance.currentItem = i;
$(".amazingaudioplayer-item-id", this).text(i + 1);
});
});
});
})(jQuery);
</script>
Please view the tutorial for how to add an audio player to Blocs for Mac: https://amazingaudioplayer.com/how-to-add-an-html5-audio-player-to-blocs/
In recent days, we have had reports that the player does not goto the next song in the playlist under Chrome version 64.
Question:
Does Amazing Audio Player support m4a audio format?
Continue reading
This tutorial shows you how to add PayPal buy now buttons to the audio player track list.
Question:
I have a question about the “Darkbox” skin. The “Information” field is hidden by the play, forward and rewind buttons (see the attached pic). How can that be solved?
Answer:
In step 2, Skins dialog, CSS tab, find the following CSS code:
#amazingaudioplayer-AUDIOPLAYERID .amazingaudioplayer-text {
display: block;
position: relative;
overflow: hidden;
padding: 4px;
height: 42px;
}
And you can change the height value to make it larger:
#amazingaudioplayer-AUDIOPLAYERID .amazingaudioplayer-text {
display: block;
position: relative;
overflow: hidden;
padding: 4px;
height: 60px;
}
Question:
Basically, I want to know if I’m able to send someone to the page the player is on but have the player playing a specific track rather than default to the first track.
For example, my customer is reading an article and there’s a link that asks them to “click here” to hear the interview. When they click I want to send them to the separate page where my player is but I want it to automatically play track 12.
Is there easy code to accomplish this?
Answer:
The following answer only works for Version 3.0 and above.
The player created with Version 3.0 and above supports two URL parameters firstaudioid and autoplayaudio. You can use the parameter to specify an audio to start.
The id of first video is 0. For example, the following URL will start playing the third audio.
This tutorial will guide you how to add download links in Amazing Audio Player, so your visitor can directly download the mp3 files from the audio player.
This tutorial is for Amazing Audio Player Version 2.6 and above.
If it’s your first time to use Amazing Audio Player, please view https://amazingaudioplayer.com/quick-start-guide/ for a quick start.
In this tutorial, we are going to use the skin DarkBox and add download links to the playlist.
In Amazing Audio Player, step 2, Skins dialog, Tracklist tab, change the value of Track list item format to the following text:
%ID%. %TITLE% <span style='position:absolute;top:0;right:0;'><a href='%AUDIOURL%' onclick='event.stopPropagation();' download='%TITLE%.mp3' target='_blank'>Download</a></span>
In the above code, %ID%, %TITLE% and %AUDIOURL% are predefined macro variables. They will be replaced by each audio id, title and audio URL dynamically.