Customizing Flourish Player

Flourish player can only be customized (other than which songs are played etc.) through newly compiling it. In order to fully customize flourish player, you need:

1. Changing the Button Graphics

In order to change the buttons, edit the SVG graphics in the gfx/ directory with an SVG editor. The directory contains SVG files for the different buttons in different states. Simply add, remove or edit the shapes of these files to change the appereance of the buttons. The recommended tool for editing the svg files is Inkscape, as the original files were also created using Inkscape.

If you want to change the overall layout of the player, please refer to section 4 below.

In order for the new button graphics to take effect, you need to compile flourish player.

2. Changing Fonts and Background Color

In order to change font or background color, edit flourish-player.xml with a text editor. The first few lines contain entity declarations that can be used to change the background color or the font that is used in flourish player. In order to change any of these declarations, simply edit the text between the "", keep all other content of the line as it is.

If you want to change the font that flourish player uses, you also have to edit the variables FontBold and FontItalic in as/ If you are importing a bold font, set FontBold to true, otherwise set it to false; If you are importing an italic font, set FontItalic to true, otherwise set it to false.

The first few lines of flourish-player.xml also contain an entity declaration that controls which characters from the font file are embedded into the produced SVG file. If e.g. your playlist contains a song with the title "Liberté", you would have to add the character "é" to the entity, because it is not imported by default (The default characters are A-Z, a-z, 0-9, some punctuation and special characters and the German umlauts Ä, Ö, Ü, ä, ö, ü and the German ß).

In order for the new font and background color to take effect, you need to compile flourish player.

3. Changing Text and Progress and Volume Bar Color

In order to change the colors of the text and the volume bar, edit as/ with a text editor. This file contains many options for the colors of flourish player. All colors in this file have to be given in the format 0xabcdef which is equal to the HTML color code #abcdef. In any line, edit only the part between the characters = and ; and keep the rest as it is.

The following options are present and changeable in this file:

In order for the new colors to take effect, you need to compile flourish player.

4. Changing the Player Layout

In order to change the player layout, changes in both flourish-player.xml and as/ have to be performed (again, both with a text editor).

In flourish-player.xml, the following entities affect the layout (change only the text between the ""):

Of course, after changing the layout, you need to compile flourish player. If you have changed the player dimension (width and height in flourish-player.xml), you also need to adapt the HTML file which embeds the player: There are two lines containing width="225" height="24". Both have to be adapted to reflect the new size, otherwise your player will be displayed distorted.

Flourish Player is powered by: