Joomla Documentation

JoomlaXTC Artist Showcase MP3 Player

Uploading the package elements

#1 Unzip the jxtc_artistshowcase_j15_unzipfirst.zip package

#2 Upload the com_jxtc_artistshowcase_j15.zip to your Joomla install via the Joomla Installer.

#3 Upload the mod_jxtc_artistshowcase_j15.zip to your Joomla install via the Joomla Installer.

#4 You need to make sure your media manager has mp3 enabled:
In your global configuration select the SYSTEM tab and check the Media Settings - Make sure MP3 is added as a Legal Extensions (File Types). If you do not see mp3 listed - add this to the end of the file list:
mp3,MP3

 

Setting Up Albums and Tracks

After installation you will first need to set up the Artist/Albums and Playlist Items.

#1 Open the Artist Showcase component from your Joomla Administration panel and select the Album admin area.

#2 You must first create a Album/Artist.   Start by selecting NEW on the top right of the page.

Album Title: Title of Album

Artist Name: Name of Artist

Image: Thumbnail Image to display for Artist

Info URL:  Link to more artist info such as BIO page

Published: Yes or No

After setting up the configuration for the Artist click the SAVE button on the top right

#3 Now we need to set up the Overall Global Configuration Parameters by clicking the Parameters Tool button on the top right of the page.

Media Source Directory:  This is the Directory where your images and mp3s will be stored.  Images is set as default

Once complete save the Configuration

#4 Setting up the playlist track items.  Select the Tracks page from the Artist Player Admin Page.

Next, Select NEW from the top right button bar

Title: This is the Track / Song Name

Track File: This is your MP3 - Browse from your select folder or upload via the upload area in the Media Manager

If you have not uploaded the mp3s via FTP you can add an MP3 here buy scrolling to the bottom of the pop up media manager after pressing browse. At the bottom you will see another browse button - This will open your local hard drive - select the mp3 to upload and then click upload. The file is now added to your folder. Select the file in the folder and scroll to top and save...

Duration: Add your own in MM:SS or the MP3 time will be calculated automatically

Enable Link?: Enable Buy Now Link

Buy Now URL: Link to Product on Itunes, Amazon, or your own shop page

Enable Download?: Enable Download Link

Download File: This is the downloadable MP3 - Browse from your select folder or upload via the upload area in the Media Manager

Album:  Attach this song to an Artist Album

Order:  This is the order to show the track in the artists playlist

Published: Yes Or No

Once complete Save and repeat the process for additional tracks

#6 Setting up the module.   To show the Artist Showcase in a module position open you Joomla module manager and select the jxtc_artistshowcase module.

Albums: Select Albums to display.
Stage Background: Background Color For Flash
Player Width: Width of Player
Player Height: Height of Player
Thumbnail Image Width: Width of Images
Thumbnail Image Height: Height of Images
Start Page Thumbnail Margin Top: Top Margin for thumbnails on start page
Thumbnail Spacing: Thumbnail Spacing
Thumbnail Margin Left / Right: Thumbnail Margin Left / Right
Stop Scroll on Hover: No or Yes
Thumbnails Border Size: Size of thumbnail borders
Thumbnail Border Color: Color of Thumbnails Border
Thumbnail Border Hover Color: Color of Thumbnails Hover Border
Player Reflection:  No or Yes
Thumbnail Reflection Size: Reflection Size of Thumbnails
Thumbnail Reflection Amount: Thumbnail Reflection Alpha Setting
Player Border Size: Player Border Size
Border Color: Player Border Color
Player Background Gradient Top Color: Gradient Color for the top half of the Player
Player Background Gradient Bottom Color: Gradient Color for the bottom half of the Player
Bottom Background Gradient Top: Bottom Background Gradient Top Color - Behind the Playlist progress bar
Bottom Background Gradient Bottom: Bottom Background Gradient Bottom Color
Auto Scroll Start Page?: Auto scrolls Start Page
Start Page Auto Scroll Speed: Auto Scroll Speed of Playlist
Scroll Button Gradient Top: Start Page Scroll Button Gradient Top
Scroll Button Gradient Bottom: Start Page Scroll Button Gradient Bottom
Start Page Scroll Bar Gradient Top: Gradient Color for the top half of the start page scroll bar background
Start Page Scroll Bar Gradient Bottom: Gradient Color for the bottom half of the start page scroll bar background
Scroll Bar Height: Height of the Scroll Bar on the start page
Start Page Scroll Bar Border Color: Border Color for start page scroll bar
Scroll Bar Slider Gradient Top Color: Gradient Color for the top half of the Scroll Button
Scroll Bar Slider Gradient Bottom Color: Gradient Color for the bottom half of the Scroll Button
Scroll Bar Slider Height: Height of the Scroll Bar Slider

Scroll Bar Slide Area Background Gradient Top: Gradient Color for the top half of the scroll bar Slide Area background
Scroll Bar Slide Area Background Gradient Middile: Scroll Bar Slide Area background middle Color
Scroll Bar Slide Area Background Gradient Bottom: Scroll Bar Slide Area Gradient Bottom


Scroll Bar Slide Area Height: Height of the Playlist Scroll Bar Slide Area
Playlist Scroll Bar Border Color: Border Color for Playlist Scroll Bar
Scroll Bar Line Color: Color of Playlist Slider Color
ToolTips Feature: ToolTips Visible?
ToolTip Background Color: ToolTip Background Color
ToolTip Text Color: ToolTip Text Color
ToolTip Dot Color: ToolTip Dot Color

Playlist Thumbnail Background Height: Playlist Thumbnail Background Height
Playlist Thumbnail Background Height: Playlist Thumbnail Title Height
Album Image Author Background Gradient Start: Album image author Background Begin Color
Album Image Author Background Gradient End Color: Album image author Background End Color
Album Image Author Background Stroke Color: Album image author Background Stroke Color
Album Image Background Color: Album image album Background Color
Album Image Background Stroke Color: Album image album Background Stroke Color
Artist / Album Name Color: Artist / Album  Name Color
Album / Label Color: Album / Label Color
Info Link Color: Info Link Color
Info Link Hover Color: Info Link Hover Color
Playlist Thumbnail Arrow Color: Playlist Thumbnail Arrow Color
Playlist Thumbnail Arrow Background Color: Playlist Thumbnail Arrow Background Color
Playlist Thumbnail Arrow Hover Color: Playlist Thumbnail Arrow Hover Color
Playlist Back Text: Playlist Back Text
Playlist Back Text Height: Playlist Back Text Height
Playlist Back Background Gradient Top: Playlist Back Background Gradient Top
Playlist Back Background Gradient Bottom: Playlist Back Background Gradient Bottom
Playlist Back Border Color: Playlist Back Border Color
Playlist Back Text Color: Playlist Back Text Color
Playlist Back Shape Color: Playlist Back Shape Color
Playlist Back Text Hover Color: Playlist Back Text Hover Color
Playlist Back Change Time: Playlist Back Change Time
Playlist Background Color: Playlist Background Color
Playlist Background Border Color: Playlist Background Border Color
Song Gradient Top: Button Gradient Top Color
Song Gradient Bottom: Button Gradient Bottom Color
Song Text Color: Button Text Color
Song Text Color 2: Button Text Color 2
Song Border Color: Button Border Color
Song Hover Color: Button Hover Color
Song Hover Border Color: Button Hover Border Color
Song Hover Text Color: Button Hover Text Color
Song Select Background Gradient Top Color: Button Select Background Gradient Top Color
Song Select Background Gradient Bottom Color: Button Select Background Gradient Bottom Color
Song Select Border Color: Button Select Border Color
Song Select Text Color: Button Select Text Color
Control Bar Gradient Top: Control Bar Gradient Top Color
Control Bar Gradient Bottom: Control Bar Gradient Bottom Color
Control Bar Border Color: Control Bar Border Color
Control Bar Height: Control Bar Height
Time Bar Gradient Top: Time Bar Gradient Top Color
Time Bar Gradient Bottom: Time Bar Gradient Bottom Color
Time Bar Background Gradient Top: Time Bar Background Gradient Top Color
Time Bar Background Gradient Middle Color: Time Bar Background Gradient Middle Color
Time Bar Background Gradient Bottom Color: Time Bar Background Gradient Bottom Color
Time Bar Background Border Color: Time Bar Background Border Color
Time Bar Background Height: Time Bar Background Height
Loading Bar Color: Loading Bar Color
Text Color: Text Color
Play / Stop / Pause Buttons Background: Play / Stop / Pause Buttons Background
Play / Stop / Pause Buttons Hover Background: Play / Stop / Pause Buttons Hover Background
Play / Stop / Pause Buttons Border Background: Play / Stop / Pause Buttons Border Background Color
Play / Stop / Pause Buttons Gradient Top: Play / Stop / Pause Buttons Gradient Top
Play / Stop / Pause Buttons Gradient Middle: Play / Stop / Pause Buttons Gradient Middle
Play / Stop / Pause Buttons Gradient Bottom: Play / Stop / Pause Buttons Gradient Bottom
Play / Stop / Pause Buttons Gradient Hover Top: Play / Stop / Pause Buttons Gradient Hover Top
Play / Stop / Pause Buttons Gradient Hover Middle: Play / Stop / Pause Buttons Gradient Hover Middle
Play / Stop / Pause Buttons Gradient Hover Bottom: Play / Stop / Pause Buttons Gradient Hover Bottom Color
Play / Stop / Pause Buttons Border Color: Play / Stop / Pause Buttons Border Color

Start Volume: Default Starting Volume
Volume Button Active Gradient Top: Volume Button Active Gradient Top Color
Volume Button Active Gradient Bottom: Volume Button Active Gradient Bottom Color
Volume Button Normal Gradient Top: Volume Button Normal Gradient Top Color
Volume Button Normal Gradient Bottom: Volume Button Normal Gradient Bottom
Volume Button Inactive: Volume Button Inactive Color
Volume Slider Border Gradient Top: Volume Slider Border Gradient Top
Volume Slider Border Gradient Middle: Volume Slider Border Gradient Middle
Gradient Bottom: Volume Slider Border Gradient Bottom
Volume Slider Background: Volume Slider Background Color
Volume Slider Background Border Color: Volume Slider Background Border Color
Volume Slider Gradient Top: Volume Slider Gradient Top Color
Volume Slider Gradient Bottom: Volume Slider Gradient Bottom Color

Embed Feature: Allow users to embed player on their site

EMBED Border Color: EMBED Border Color
EMBED Button Gradient Top: EMBED Button Gradient Top
EMBED Button Gradient Middle: EMBED Button Gradient Middle Color
EMBED Button Gradient Bottom: EMBED Button Gradient Bottom Color
EMBED Button Icon Color: EMBED Button Icon Color
EMBED Button Icon Hover Color: EMBED Button Icon Hover Color
EMBED Window Main Border Color: EMBED Window Border Color
EMBED Window Main Color: embed_window_mainColor
EMBED Window Border Color: EMBED Window Border Colorr
EMBED Window Color: EMBED Window Color
EMBED Window Text Color: EMBED Window Text Color
EMBED Window EMBED Text Color: EMBED Window EMBED Text Color
EMBED Window Button Color: EMBED Window EMBED Button Color
EMBED Window Button Border Color: EMBED Window Button Border Color
EMBED Window Button Text Color: EMBED Window Button Text Color
EMBED Window Button Hover Color: EMBED Window Button Hover Color
EMBED Window Background Hover Color: EMBED Window Background Hover Color
EMBED Window Title Text Color
EMBED Window Copy Me Text Color: EMBED Window Copy Me Text Color

Buy Button Gradient Top: Buy Button Gradient Top Color
Buy Button Gradient Bottom: bBuy Button Gradient Bottom Color
Buy Button Border: Buy Button Border
Buy Button Hover Gradient Top: Buy Button Hover Gradient Top Color
Buy Button Hover Gradient Bottom: Buy Button Hover Gradient Bottom Color
Buy Button Hover Border Color: Buy Button Hover Border Color
Buy Button Select Gradient Top: Buy Button Select Gradient Top Color
Buy Button Select Gradient Bottom: Buy Button Select Gradient Bottom Color
Buy Button Select Border Color: Buy Button Select Border Color
Buy Button Icon Color: Buy Button Icon Color

Autoslide Pause Margin: Autoslide Pause at Margin Value

Shuffle Color: Shuffle Color
Shuffle Hover Color: Shuffle Hover Color

Loop Playlist: Playlist Auto Loop

Auto Start Playlist: Automatically start playing playlist
Auto Play Playlist Starting Track: Track Number to start Auto Play
Auto Shuffle: Auto Shuffle
Auto Play Songs: Auto Play Songs

Link Target Value: Link Target Value
Album Title: Album Title
Now Playing Title: Now Playing Title
Play Title: Play Title
Pause Title: Pause Title
Next Title: Next Title
Previous Title: Previous Title
Shuffle Title: Shuffle Title
Volume Title: Volume Title
Share Title: Share Title

Module Class Suffix: