Home Documentation Highslide JS for Joomla Slideshow Gallery Preset Configurations
10 | 20 | 2018
NOTICE: If you intend to use Highslide JS on a commercial website you MUST purchase a license from the author. Please go to Highslide.com for more details.
Slideshow Gallery Preset Configurations
Saturday, 18 April 2009 09:39

Introduction

A feature of the Highslide JS for Joomla configuration component is the 'Slideshow Presets' section on the Slideshow tab.  These presets  provide quick access to a set of predefined slideshow configurations that you can use to create slideshow galleries in your articles. See below.

example1

 

Select the preset that you wish to use, optionally set the additional preset parameters to suit your taste and publish the configuration.  You can then add highslide thumbnail/popup expanders to your article for inclusion in the gallery display.

NOTE: Do not set the 'Enable slideshow' parameter in the Slideshow Settings section to 'Yes' if you are only intending to use a slideshow preset.  Selection of the preset is all that you need to do to activate it.  Setting the 'Enable slideshow' parameter activates the settings in the 'Slideshow Settings' section and can interfere with the preset settings.

With a few exceptions, once you have added the highslide expanders to your article, you can switch from one slideshow preset to another by simply selecting a different preset and republishing your highslide configuration.

A sample gallery page for each preset has been provided to show each slideshow configuration in action.

  1. borderless-floating-caption.
  2. controls-in-heading.
  3. dark-design.
  4. gallery-floating-thumbs.
  5. gallery-horizontal-strip.
  6. gallery-in-box.
  7. gallery-in-page.
  8. gallery-thumbstrip-above.
  9. gallery-thumbstrip-below.
  10. gallery-vertical-strip.
  11. no-border-floating-caption.
  12. white-design.
  13. caption-overlay-small-thumbstrip

 

Adding images to the slideshow

You can use the Imageloader module or plugin to add images to your article for use with the gallery presets.  Imageloader gives you the ability to load the images from a directory of your choice and/or from a text configuration file.

If you decide that Imageloader does not fit your requirements, continue on with the sections below for details about using JCE HsExpander to add images for your slideshow.

Creating the gallery expanders

There are a couple of things to consider when adding highslide expanders to an article for inclusion in a slideshow gallery.

Which expanders will be included in the slideshow?

If you are going to have highslide expanders on the page other than those that will be included in the gallery or if you want to have more than one gallery on the page, you must somehow identify which expanders go in the galley and which ones do not.

This is done by assigning a slideshow group to the slideshow configuration as shown below.

example2

For multiple galleries, you can specify additional slideshow groups by seperating them with a comma, i.e. gallery1, gallery2 ...etc.  Then,  assign each expander to one of the slideshow groups.

example3

 

Which gallery expanders do you want visible on the page?

The example pages presented here hide all but one of the expander thumbnails from view.  To do this, decide which expander you want to be visible and assign a unique id to the thumbnail image of that expander as shown below.

example4

 

For each expander that you want hidden, assign a class name of 'hidden-container' to the thumbnail image. This hides the thumbnail from view.

example5

 

Also, on the options tab, set the Thumbnail Id parameter to the unique id of the visible expander ('thumb1'). This allows Highslide to expand/contract the gallery from the visible thumbnail image  For example, when you close the gallery while viewing one of the hidden images, the gallery will contract into the visible thumbnail.

example6

 

Other Configuration Options

There are additional configration options  than you can use to indicate whether the gallery should repeat when reaching the last gallery image or whether to autostart the slideshow when the gallery is opened.  You can also specify how long the gallery image is to be displayed before transitioning to the next.  These are all a matter of choice.

example7

 

 

 

Last Updated on Tuesday, 25 May 2010 05:57