Help is on the way!

Browse our Documentation, Search the Knowledge Base, Still need help? Send us a support ticket.

Reference Guide

The Joomla! XTC JoomGallery Category Wall module enhances your site with incredible power to display JoomGallery Categories with your custom CSS and HTML in a module position. Choose items by Owner and other criteria and display them with your own templates limited only by your imagination. Its the perfect tool for developers with custom styles in mind. The module can display groups in rows, columns and grids as well as special scrolling effects for sliders and transitions.

Installation

Install the module via the Joomla! 1.5 Installer.

Usage

The JoomGallery Category Wall module is an advanced module for Joomla! that enables you to customize not only the categories attributes, but the overall markup of the module contents. You can use one of our predesigned templates included with the module or if you have HTML or CSS Knowledge, you can create your own designs.

Module Parameters

SELECTION PARAMETERS:

Use thise parameters to specify what categories to show

Owner

Filter according the category owners.

Sort field

Sorting criteria.

Sort order

Acendent - Desendent.

DISPLAY PARAMETERS:

Use these parameters to customize the layout of the module box.

Columns

Number of columns to show.

Rows

Number of rows to show.

Pages

Number of pages to show. Transition effects are enabled between page changes.

Display Style

Transition effect mode.

Window Width

Width (in pixels) of the window frame when using Window display style.

Window Height

Height (in pixels) of the window frame when using Window display style.

Transition pause

Pause time between page transitions in milliseconds. A value of -1 disables automatic transitions. Default value is: 4000.

Transition duration

Page transition effect duration in milliseconds (default: 1500).

Slide orientation

Slide transition orientation.

Transition type

Transition animation type.

Transition Ease mode

Ease in – Ease out – Ease in out

Button Style

Button graphic set to use when buttons tags are enabled.

Template

To select one of our predesigned template. NOTE: Select -None selected- if want to use Module HTML template and Main Content HTML template fields.

Module HTML template


HTML/CSS code to display the overall module box. You can embedd any of the following tags:

{leftbutton}

Draws a "Left/Back/Previous" button.

{mainarea}

This tag draws the articles main area blocks, including the special effects.

{pages}

Displays a numbered page list for quick browsing.

{rightbutton}

Draws a "Right/Forward/Next" button.

Main Content HTML template


HTML/CSS code to display each item. You can embedd any of the following tags to display article information:

{id}

The id of the picture

{name}

The name of the category

{owner}

The owner of the category.

{description}

The description of the category, this description includes html tags

{rowdescription}

The description of the category, description without html tags

{link}

The URL to the JoomGallery Category

{ocoverurl}

URL to the original Category cover

{ocover}

The original Category cover

{coverurl}

Category URL to the cover displayed for JoomGallery

{cover}

Category Cover displayed for JoomGallery

{thumbnailurl}

URL to the Thumbnail of the JoomGallery Category Cover

{thumbnail}

Thumbnail of the JoomGallery Category Cover


Cover width


Width of the Cover of the category in pixels.

Cover height

Height of the Cover of the category in pixels.

Thumbnail width

Width of the Thumbnail in pixels.

Thumbnail height

Height of the Thumbnail in pixels.

Description Length

Maximum length for descpription to display. Empty = no limit.

Module Class Suffix

A suffix to be applied to the CSS class of the module.

ADVANCED PARAMETERS:

Tool Tip / Pop Up FX Settings:

In Opacity

The opacity (0, 0.1, 0.5..etc.. to 1 = full opacity) the element will turn when mouse enters the trigger..

Out OPacity

The opacity (0, 0.1, 0.5..etc.. to 1 = full opacity) the element will turn when mouse leaves the trigger..

In Animation Vertical

The distance the tooltip will move verically (in px) when the mouse enters the trigger.

Out Animation Vertical

The distance the tooltip will move verically (in px) when the mouse leaves the trigger.

In Animation Horizontal

The distance the tooltip will move horizontally (in px) when the mouse enters the trigger.

Out Animation Horizontal

The distance the tooltip will move horizontally (in px) when the mouse leaves the trigger.

Fade-in Duration

The duration of the animation when mouse enters the trigger.

Fade-Out duration

The duration of the animation when mouse leaves the trigger.

Pause

The time the tooltip will stand before begining the animation when mouse leaves the trigger.

Tooltip animation mode

Select one of the many functions to animate.

Tooltip / Popup ease mode

Choose one ease effect, between Ease In, Ease Out or Ease In Out. This setting is not used when "Slide Animation Mode" is set to Linear.

Centered Pupup

Center pupop?

Slide It FX Settings:

These parameters control Slider effect.

Sliding Panels Settings

Choose a presetted animation from the list.


The following Settings are used ONLY when Sliden Panels Settings is set to CUSTOM

Slide Panel X in

The distance (in px) from the left container border that the slide panel will go to when the mouse enters the container.

Slide Panel X out

The distance (in px) from the left container border that the slide panel will go to when the mouse leaves the container.

Slide Panel Y in

The distance (in px) from the top container border that the slide panel will go to when the mouse enters the container.

Slide Panel Y out

The distance (in px) from the top container border that the slide panel will go to when the mouse leaves the container.

Slide animation mode

Select one of the many functions to animate the slide effects.

Slide ease mode

Choose one ease effect, between Ease In, Ease Out or Ease In Out. This setting is not used when "Slide Animation Mode" is set to Linear.

Frames per Second

The frames per second used to animate the efffect. Note: Using a high value in a heavy site could decrease the video perfomance. Combine this setting with "Frame Duration" to get a smooth effect.

Fame Duration

The time in miliseconds the duration will last.

Hover FX Settings:

These Parameters Control the Hover Effect

Hover Effect in Color

The background color that will fade in when mouse enter the element with class="js_hover".

Hover Effect Out Color

The background color that will fade out when mouse leaves the element with class="js_hover".

Examples:

Click the name of the demo to see the configuration that we use.

Video Tutorial

Didn't find an Answer?

If you didn't find the answer you were looking for from the links above.




SUBMIT SUPPORT TICKET

Didn't find an Answer?

If you didn't find the answer you were looking for from the links above.




SUBMIT SUPPORT TICKET