Edit Audio Player

Posted by

Customizing The Audio Player 

autostartnoif yes, player starts automatically
loopnoif yes, player loops
animationyesif no, player is always open
remainingnoif yes, shows remaining track time rather than ellapsed time
noinfonoif yes, disables the track information display
initialvolume60initial volume level (from 0 to 100)
buffer5buffering time in seconds
encodenoindicates that the mp3 file urls are encoded
checkpolicynotells Flash to look for a policy file when loading mp3 files
(this allows Flash to read ID3 tags from files hosted on a different domain)
rtlnoswitches the layout to RTL (right to left) for Hebrew and Arabic languages
Flash player options
widthrequiredwidth of the player. e.g. 290 (290 pixels) or 100%
transparentpagebgnoif yes, the player background is transparent (matches the page background)
pagebgNAplayer background color (set it to your page background when transparentbg is set to ‘no’)
autostart: ‘yes’, bg: ‘e5e5e5′
Colour scheme options
1leftbgCCCCCCSpeaker icon/Volume control background
2lefticon333333Speaker icon
4righticon333333Play/Pause icon
5rightbgB4B4B4Play/Pause button background
7trackerDDDDDDProgress track
8loader009900Loading bar
9trackFFFFFFLoading/Progress bar track backgrounds
10borderCCCCCCProgress bar border
11pagebgNAplayer background color (set it to your page background when transparentbg is set to ‘no’)
12volslider666666Volume slider
13voltrackF2F2F2Volume track
14rightbghover999999Play/Pause button background (hover state)
15righticonhoverFFFFFFPlay/Pause icon (hover state)
skip666666Previous/Next skip buttons


You can change the color of the various components of the audio player, by including additional pieces of code in the Audio Player Options; example:
Player Flashvars:
But I thought I might make things more clear by showing which piece of code corresponds to which component of the audio player (plus correct a couple of mistakes and omissions):
All colour codes must be 6-digit HEX codes without ‘#’ or ‘0x’ in front.
When hovering over:
The images above display the default look of the audio player, i.e. what you get if you don’t add any extra command.

Blog, Updated at: 12:08 AM


Post a Comment