JoomlaXTC FM Gallery
The FM Gallery component is an easy-to-use tool to create an "eye candy" Gallery to show your portfolio or some of your cool pictures. Among its features are:
- Unlimited Galleries with independent configuration.
- Unlimited Media items per gallery.
- Power to show .mp4, .mov, .fla and another flash supported codec videos as media items in the albums.
- Supports MP3 audio format.
- Customizable Gallery size.
- Full screen option available.
- Support for international characters such as Greek, French, Chinese, Japanese, and a lot more languages.
Installation
Follow these steps to install the component:
- Unzip the jxtc_gallerypro_j15_unzipfirst.zip package in your PC.
- Upload all the extracted files to your Joomla install via the Joomla Installer. com_jxtc_gallerypro_j15.zip Contains the required frontend and backend components interfaces and mod_jxtc_gallerypro_j15.zip contains the optional FM Gallery display module.
Component Configuration
Access the component administration pages by selecting "JXTC Grid Gallery" from the Joomla! administration Components menu.
In order to show the FM Gallery in your site you must first create a Gallery, a gallery represents a collection of images, music, videos or any supported media that you want to show to your visitors. You can have an unlimited amount of Galleries defined, but only one can be visible at any time in the component. You can display more Galleries by using one or more copies of the Module version.
Creating and Configuring Galleries
Select the Galleries menu option; this will take you to a list of all galleries defined in your system. To create a new gallery click on the "New" icon in the top right.
The gallery edition page will display the area where you can define the attributes of the collection:
Gallery Setup
The parameters in this section are:
Details: Use these parameter to set the general parameters of the gallery.
- Title
- Gallery title.
- Width
- Width of the gallery player box (in pixels).
- Height
- Height of the gallery player box (in pixels).
- Background
- Select a optional background image to display.
- Panel Background Color
- Panel background color (if enabled). Click on the field to activate a Color Picker.
- Panel Border Color
- Color of border around panel (click on the field to activate a Color Picker).
- Panel Border Width
- Width of border around panel.
- Published
- Use this parameter to set a Gallery as as active or inactivate.
Effect Parameters: The gallery have three players, one for image, another for music and finally one for videos. Use these parameter to customize the display of the items that each gallery have.
Image Player Settings: Use these parameters to control the thumbnails and images into the gallery.
- Thumbnail width
- Width of thumbnail images (in pixels).
- Thumbnail height
- Height of thumbnail images (in pixels).
- Horizontal spacing
- Horizontal space between thumbnail images (in pixels).
- Vertical spacing
- Vertical space between thumbnail images (in pixels).
- Allow Zoom
- Enable or disable thumbnail zoom.
- Allow mazimize
- Enable or disable thumbnail maximize option.
- Fullscreen button
- Enable or disable full screen button.
- Overlay color
- Thumbnail overlay shape color.
- Icon color
- Thumbnail icon color.
- Icon selected color
- Thumbnail icon selected color.
- Button background color
- Use to change the color of the background of the buttons.
- Select background color
- The backghround of the button will take this color if you put the mouse over it.
- Zoom icon color
- Select the color of the icon when the zoom effect is activated.
- Zoom background color
- Choose the color that want to display as background when the zoom effect is activated.
- Thumbnail outline color
- This parameter modify the color of the outline of the thumbnail.
- Thumbnail outline selected color
- This parameter modify the color of the outline of the thumbnail when is selected.
- Media icon color
- Choose the color that want to show in the media icon.
- Media icon background color
- Select the background color that want to show in the media icon.
- Background color
- Select the backgound of the color of the Image Player.
- Preloader color
- Select the backgound of the preloader color of the Image Player.
MP3 Player Settings: Use these parameters to control the mp3 player in the gallery.
- Player width
- Player width (in pixels).
- Player height
- Player height (in pixels).
- Control bar delay
- Time to hide the control bar after a mouse move.
- Show spectrum
- Enable or disable audio spectrum display.
- Spectrum color
- Use this parameter to modify the color of the spectrum that the Music Player shows.
- Audio autoplay
- Enable or disable audio audio autoplay.
- Audio looping
- Enable or disable audio looping.
- Audio volume
- Initial audio volume (0=off, 100=full).
- Button color
- Choose the color for the buttons of the Music Player.
- Selected button color
- When the mouse is over a button of the player will take this color.
Video Player Settings: Use these parameters to control the video player in the gallery.
- Player width
- Player width (in pixels).
- Player height
- Player height (in pixels).
- Video autoplay
- Enable or disable video autoplay.
- Video looping
- Enable or disable video looping.
- Video volume
- Initial video volume (0=off, 100=full).
- Video smoothing
- Enable or disable video smoothing.
- Control bar delay
- Time to hide the control bar after a mouse move.
- Fullscreen button
- Enable or disable video full screen button.
- Buffer color
- Use this parameters to change the color of the bar that indicates the buffer.
- Button color
- Choose the color for the buttons of the Video Player.
- Selected button color
- When the mouse is over a button of the player will take this color.
Creating and Configuring Media Items
Once you have a gallery configured, select the Media menu option; The goal now is to create media items and link them to the gallery previously made. To create a new media item click on the "New" icon in the top right.
The media edition page will display the area where you can define the attributes of the media item:
Media Setup
The parameters in this section are:
- Title
- Select media
- Set the url to the video/image/audio that want to show, note that can use the incorporated media manager to upload and select images, music and videos in your server.
- Select thumbnail
- Select the image that will be show as presentation of your Media Item
- Description
- Add the description of the video/image/audio that you want to show
- Gallery Name
- Select the gallery that the media item will be added to.
- Order
- Use to select the position of the media item in the album.
- Published
- Use this parameter to set as active or inactivate an item.
Component On Front page
After galleries are created and populated , you can use the component to display them on your site's frontend. You can do this by selecting which of the available galleries will be shown in the component by going to the Gallery screen in the component, selecting one gallery and marking it as "Default" by clicking on the icon in the top right. Now you can create a Joomla menu entry to display your Gallery.
Creating a FM gallery menu option
To make a menu option link to FM gallery component, you should use the standard Joomla! Menu Manager to edit the desired menu:
- Click on the "New" icon in the top left to create a new menu entry
- On the menu entry settings page, edit the fields on the left "Menu Item Details" area according to your preference
- If needed, open the "Parameters (System)" tab and edit the fields as you wish
- Click on the "Save" or "Apply" icons on the top left to store your changes
You have now created a menu link that will display the FM gallery player view.
Module Configuration
Some times we want to display the FM gallery in another page with more content or as a complement for another content, in this case we can use the module included with your component package.
The module can be customized using the standard Joomla! Module Manager.
To access these parameters go to the module manager and select the FM Gallery Module (in Joomla! module manager his name is JoomlaXTC Gallery Pro Module).
| Gallery | Select the gallery that want to show |
You can now see the FM Gallery in a module position.
Tips to use the FM Gallery
There are some considerations while using the Grid Gallery, please take note of the following:
- Remote files might be subject to Flash 10 security restrictions, read about Flash "crossdomain.xml" files to enable your site to read external files.
- Although some video files do have the "right" file codec, their actual binary format might not be accepted by Flash for playback. You can review all the valid codecs here
F.A.Q.
- Why my component/module only shows black squares in the place where the thumbnails must be?
- Make sure that you has set an thumbnail in all the fields of the items of the gallery, if it has a missing thumbnail it will not work properly.
