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:

  • Birds Through Branches, Niagara
  • Bird on a Branch, Niagara
  • Arabian Sea, Anjuna Beach (Goa)
  • Merlion, Singapore
  • Python, Singapore
  • Bellagio Flower Garden, Las Vegas

The above is generated using the following code:

 [gallery style='strip-below'] 

The style='strip-below' parameter tells Photonic to display a strip of thumbnails at the bottom of the slideshow. You could just as well have the style attribute take the following values:

  • strip-below – Displays the thumbnail strip below the slideshow.
  • strip-above – Displays the thumbnail strip above the slideshow.
  • strip-right – Displays the thumbnail strip to the right of the slideshow.
  • no-strip – Displays just a slideshow, no strip.
  • launch, or square – No slideshow; displays only thumbnails, which can be clicked to launch a lightbox.
  • circle – No slideshow; displays only circular thumbnails, which can be clicked to launch a lightbox.
  • random – No slideshow; displays a randomized justified grid, which can be clicked to launch a lightbox.

The following illustrates the use of style='launch':

 [gallery style='launch' columns=6] 

And this is random:

[gallery style='random']
Birds Through Branches, Niagara
Bird on a Branch, Niagara
Arabian Sea, Anjuna Beach (Goa)
Merlion, Singapore
Python, Singapore
Bellagio Flower Garden, Las Vegas

While displaying a slideshow, a lot of implicit parameters come into the picture, which can be overridden via the shortcode:

  • fx – Can take values fade or slide, defaults to slide.
  • speed – Takes numeric values in milliseconds, determines the speed of transitioning of slides.
  • timeout – Takes numeric values in milliseconds, determines the pause between two slides.
  • pause – Takes values 0 (no pause) and 1 (pause), determines if the slideshow should pause upon hovering on it.
  • controls – Takes values show and hide, and shows “Previous” and “Next” buttons on the slideshow.
  • strip-style – Takes values thumbs and button. If set, and if the layout / style parameter is set to strip-below, strip-above, strip-right, it shows buttons below the slideshow, replacing the thumbnails.

The following uses:

[gallery style='strip-below' strip-style='buttons' controls='show']
  • Birds Through Branches, Niagara
  • Bird on a Branch, Niagara
  • Arabian Sea, Anjuna Beach (Goa)
  • Merlion, Singapore
  • Python, Singapore
  • Bellagio Flower Garden, Las Vegas