WP Galleries
Native WP galleries can be displayed much better using Photonic. To display a gallery this is the standard shortcode usage:
[gallery id='xyz']
If the gallery is a part of the same post, then the id is not needed. By default WP’s galleries have this type of an output:
So what can Photonic do? For starters, if you use a style attribute, here is what you get:
The above is generated using the following code:
[gallery style='strip-below' thumb_width='100' thumb_height='75' slideshow_height='520']
The slideshow_height parameter is required for WebKit-based browsers such as Chrome and Safari. Without this, there are overlaps between the slides and everything else below them.
The above assumes some implicit parameters, thumb_size, slide_size, fx and speed.
The thumb_size and slide_size parameters control the WP-resized image that needs to be fetched. This is particularly useful if you have a very large sized original image, in which case slide_size can be used to retrieve a smaller size. By default this is set to large. The thumb_size parameter is used to retrieve the thumbnail displayed. It takes a default value thumbnail. It can be additionally resized using the thumb_width and thumb_height parameters.
The fx parameter can take values from JQuery Cycle’s impressive options:
fadescrollUpscrollDownscrollLeftscrollRightscrollHorzscrollVertslideXslideYturnUpturnDownturnLeftturnRightzoomfadeZoomblindXblindYblindZgrowXgrowYcurtainXcurtainYuncoverwipe
The default fx is fade, but while invoking a slideshow you could pretty much use any of the other effects from the list above.
The other implicit parameter, speed takes a value 1000. You can specify any other value in milliseconds.
The style attribute can take the following values:
strip-below– Displays the thumbnail strip below the slideshow.strip-above– Displays the thumbnail strip above the slideshow.no-strip– Displays just a slideshow, no strip.launch– Displays only thumbnails, which can be clicked to launch a slideshow.
The following illustrates the use of style='launch':
[gallery style='launch' thumb_width='100' thumb_height='75' columns=6]
