XSPF Player: Options

title1

[ ]

Changing Players Sizes

Applying Skin Mode

Turning Off Various Components

Changing Player Sizes

Above are a few examples of the many modes in which you can present the player on a webpage.

--------------

The following are modes that can be activated by adding the appropriate code to the URL string:

xspf_player.swf?&player_mode=mini
xspf_player.swf?&player_mode=small

Mini mode:

In mini mode, the player does not show the forward, backward buttons. It also loses the playlist section and album area. The repeat and shuffle buttons are also removed.

Small mode:

In small mode, the player has a smaller area for album art.

Example A

In this example, the HTML code is using the mini mode option, coupled with the width parameter
(set to 108 pixels across).

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="108" height="17">
<param name="movie" value="xspf_player.swf?&player_mode=mini" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&player_mode=mini" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="108" height="17"></embed>
</object>

Example B

In this example, the HTML code is using the mini mode option, coupled with the width parameter
(set to 60 pixels across).

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="60" height="17">
<param name="movie" value="xspf_player.swf?&player_mode=mini" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&player_mode=mini" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="60" height="17"></embed>
</object>

Example C

Here we have the small mode option set.

Since small mode has reduced the size of the album area, we will need to adjust
the html height of player to even out the bottom (set to 103).

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="103">
<param name="movie" value="xspf_player.swf?&player_mode=small" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&player_mode=small" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="400" height="103"></embed>
</object>

Skin Mode

hjkssdfsdfs

Turning Off Components

The following components of the player can be turned off by adding the appropriate code to the URL string:

album=off

bottom_controls=off

counter=off

volume_btn=off

Example A1

png

If the album cover component of the player is turned off, the bottom
controls will move underneath the playlist area and stretch to playlist area size.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="170">
<param name="movie" value="xspf_player.swf?&album=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&album=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="400" height="170"></embed>
</object>

Example A2

This feature comes in handy when more room is needed for track tiles,
although the player will automatically scroll track info if it does not fit.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="170">
<param name="movie" value="xspf_player.swf?&counter=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&counter=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="400" height="170"></embed>
</object>

Example A3

Another room saver feature.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="170">
<param name="movie" value="xspf_player.swf?&bottom_controls=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&bottom_controls=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="400" height="170"></embed>
</object>

Example A4

Frees up more space for track title.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="170">
<param name="movie" value="xspf_player.swf?&volume_btn=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&volume_btn=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="400" height="170"></embed>
</object>

Example A5

In this example, all possible components are off, coupled with the html width parameter
(set to 300 pixels across) and height parameter (set to 132). The longest "named" track
fits comfortably within the track info bar.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="170">
<param name="movie" value="xspf_player.swf?&album=off&counter=off&bottom_controls=off&volume_btn=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&album=off&counter=off&bottom_controls=off&volume_btn=off" quality="high" wmode="transparent" type="application/x-shockwave-flash" width="400" height="170"></embed>
</object>

Example B1

This is an example of combining the component remover feature with the player
mode feature. The player mode is set to small. The volume button, counter, and
bottom controls have been removed. Width & height are set as well.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="280" height="86">
<param name="movie" value="xspf_player.swf?&player_mode=small&counter=off&bottom_controls=off&volume_btn=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&player_mode=small&counter=off&bottom_controls=off&volume_btn=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="280" height="86"></embed>
</object>

Example B2

Another combo example, this time with player mode mini. Since mini mode
automatically turns off the album, playlist, and bottom controls area,
all that is added in the html code is volume_btn=off and counter=off.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="110" height="86">
<param name="movie" value="xspf_player.swf?&player_mode=small&counter=off&volume_btn=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&player_mode=small&counter=off&volume_btn=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="110" height="86"></embed>
</object>

Example B3

Yet another combo example. Player mode is set to mini. Tacked on volume_btn=off
and counter=off. But this time the html width and height have been set to 20 by 20.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="20" height="20">
<param name="movie" value="xspf_player.swf?&player_mode=mini&counter=off&volume_btn=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&player_mode=mini&counter=off&volume_btn=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash" width="20" height="20"></embed>
</object>

Example B4

This final example shows that my player can indeed be reduced to just a
floating play button on your web page. Once again the player mode has been
set to mini, volume & counter removed, but this time we tack on skin_mode.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"width="20" height="20">
<param name="movie" value="xspf_player.swf?&player_mode=mini&skin_mode=on&counter=off&volume_btn=off" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<embed src="xspf_player.swf?&player_mode=mini&skin_mode=on&counter=off&volume_btn=off" quality="high" wmode="transparent"
type="application/x-shockwave-flash"width="20" height="20"></embed>
</object>

2006-2011 esteban sagrero

previous update 01.22.2011 / updated 05.15.2011