Information Field Hidden in Darkbox Skin

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;
}

Playing a Specific Track

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.

https://amazingaudioplayer.com/examples/html5-mp3-player-with-playlist-id5/?firstaudioid=2&autoplayaudio=1

How to add download links in Amazing Audio Player

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.

Step1 - Create Audio Player in Amazing Audio Player

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.

Step 2 - Customise the Player skin and add download links

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.

Add audio player to Adobe Muse

Question:

Greetings. I am trying out your product before I buy it, and I was able to go through the steps easily. However, I seem unable to place the player on a page in Muse, or successfully insert the code. Do you have any recommendations?

Answer:

You can view the following tutorial and use an iframe to insert the player to Adobe Muse:

https://amazingaudioplayer.com/how-to-insert-an-html5-audio-player-to-your-webpage-with-iframe/

Audio not playing on website

Question:

Can you help me figure out why the audio will not play on my webpage?

My download works which is the same URL for the play option.

Answer:

I checked your webpage, it looks like you have modified the HTML code generated by the application or you have generated the player HTML code by yourself.

The HTML code that defines the audio file looks like following:

<li data-artist="pinkzebra - AudioJungle" data-title="In The Moment of Inspiration" data-album="" data-info="" data-image="audios/dandelion.jpg" data-duration="154">
<div class="amazingaudioplayer-source" data-src="audios/In the Moment of Inspiration.mp3" data-type="audio/mpeg" />
</li>

The mp3 link and image link are defined by the attributes data-src and data-image. You need to make sure the links are correct.

Adding Audio Player to Webpage

Question:

Hi. I`m trialling the Amazing AudioPlayer, and if I like it I will be buying the unlimited sites version, but I cant get it working right on my first site. Can you help. I have uploaded both folders and the html page via Filezilla. I have copied the code to the correct areas within my page and the player appears there, but when I click play nothing happens.

Answer:

I checked your page, The problem is because there are apostrophes or single quotes in your mp3 file name. Please remove the apostrophe from your mp3 file name and try again.

After you update the player HTML code and files, please clear caches of your web browser before testing.

If there is any issue of inserting the player to your webpage, you can also try to use an iframe: https://amazingaudioplayer.com/how-to-insert-an-html5-audio-player-to-your-webpage-with-iframe/. It's a simpler way to insert the player to your webpage.

How to change the size of skin Darkbox to a smaller value

Question:

How to change the size of skin Darkbox to a smaller value

Answer:

The default width of skin Darkbox is 320px. The following steps will change the width to 300px:

1. In Skins dialog, Overview tab, Size and play mode, change the width to 300

2. In Information tab, change the  image width and height to 80/80

3. In Tracklist tab, change the track list width to 300.

Multiple audio players on web page

Question:

I am interested in your audio player, for my music website, i have several albums, so can i copy the audio player on my webpage, so each of my albums are distinctive, or all the music have to be on the one audio player , and how many songs can i list in the audio player.

Answer:

Both methods will work.

You can add all of your audios to one player, or you can use multiple players and add them to one webpage:  http://amazingaudioplayer.com/how-to-add-multiple-html5-audio-players-to-one-webpage/.  There is not a limit of how many songs can be listed in one audio player.