Photonic

 

The Photonic plugin provides photo-blogging extensions to the WordPress gallery shortcode. Along with support for Flickr, Smugmug, Zenfolio, Picasa, Instagram and 500px, it provides a host of added functionality with JQuery goodness:

Native WP Galleries

Standard WordPress galleries can be displayed as slideshows either automatically or upon clicking on a thumbnail.

Third-Party Providers

Photonic helps fetch photos from various third-party providers, viz. Flickr, PicasaWeb, 500px, Smugmug, Zenfolio and Instagram. Some of these providers require you to sign up for an API key, and I don’t bundle my own with the app for two simple reasons:

  1. Potential rate-limiting
    Let’s say I had bundled my Flickr API key with the plugin and you were using it to show your photos. If you had several thousand photos, the fetching of those photos would get tagged to my id, potentially marking me as a “high use” individual. Flickr might then decide that since I am using my key so much, it should make me upgrade my level of service, or it might block my API key. These are potentially dangerous for both, me, and the end user. As a result, Photonic enforces the use of an individual’s API key.
  2. Authentication
    Various providers let you control access for who gets to see your photos. If my API key was being used, there would be no way for you to use your access control list.

Of all the providers:

  • Flickr always needs an API key.
  • Picasa only needs a key if you want to show private photos to select individuals.
  • 500px always needs an API key. At the time that I had applied, getting the 500px API key approved used to take a few days. I am not sure how it is now.
  • Smugmug needs an API key, which you can create from your user profile page.
  • Instagram needs an API key, that you can create from its website.
  • Zenfolio doesn’t need an API key

Flickr

With simple parameters the gallery short-code can now be used to display almost everything from Flickr:

Picasa

You can also display a Picasa web-album with this extension.

500px

Photos from 500px can be displayed quite easily too.

Smugmug

SmugMug support is built into the plugin as well:

Currently there is no support for viewing password-protected albums along with other, non-password-protected albums from Smugmug. However, photos within individual password-protected albums can be viewed by passing the additional password attribute.

Zenfolio

The following features of Zenfolio are supported:

Currently password-protected photosets or groups from Zenfolio are not supported.

Instagram

Instagram is not as full-featured as the providers above. Instagram support is provided, keeping in mind that most people use it for social purposes

Presentation

Multiple Layouts

By using the layout parameter for the shortcode, you can get three different alignments for your photos.

Square Thumbnails - the default

Square Thumbnails – the default


Circular Thumbnails

Circular Thumbnails


Random Tiled Gallery

A cool-looking randomly tiled grid in a justified layout

Lightboxes

The following JS libraries are supported for slideshows:

  • Fancybox – ~16KB, phased out in favour of the non-GPL Fancybox2.
  • Colorbox – ~10KB, actively maintained, lightweight
  • PrettyPhoto – ~23KB, very feature rich
  • Swipebox – ~12KB, my personal favourite, touch gesture-friendly

The libraries have been tweaked to support external scripts such as JQuery Tooltips (bundled with WordPress), so if you have a different plugin that introduces these scripts, you might have a conflict. In addition, while the first three are not touch-friendly out of the box, I have bundled a script called Touchwipe that adds to them the capability to handle gestures. Swipebox just works out of the box in that regard.

Lightboxes for Non-Photonic Images

Photonic gives you the option of using its lightbox for non-Photonic images as well. This obviates the need for a separate lightbox plugin, and also keeps the look-and-feel consistent across your site. To activate this, go to Photonic → Settings → Generic Options → Generic Settings → Photonic Lightbox for non-Photonic Images and select that option. In all cases where an image is encased within an <a> tag, Photonic will convert it to a lightbox-enabled link. The lightbox used is the one you have selected for your Photonic galleries.

What if you wanted to group photos together for your lightbox, like a pseudo-gallery? You can use the rel attribute of your <a> tag for this purpose. If your lightbox is Fancybox, or Colorbox, or Swipebox, pretty much any name for your groups works, so you could name your rel attributes thus:

	<a href='image1.jpg' rel='group1'><img src='image1-thumb.jpg' /></a>
	<a href='image2.jpg' rel='group1'><img src='image2-thumb.jpg' /></a>
	<a href='image3.jpg' rel='group1'><img src='image3-thumb.jpg' /></a>

	<a href='image4.jpg' rel='group2'><img src='image4-thumb.jpg' /></a>
	<a href='image5.jpg' rel='group2'><img src='image5-thumb.jpg' /></a>
	<a href='image6.jpg' rel='group2'><img src='image6-thumb.jpg' /></a>

If you have picked PrettyPhoto as your lightbox, you will need a little bit of special handling for the rel attribute:

	<a href='image1.jpg' rel='photonic-prettyPhoto[1]'><img src='image1-thumb.jpg' /></a>
	<a href='image2.jpg' rel='photonic-prettyPhoto[1]'><img src='image2-thumb.jpg' /></a>
	<a href='image3.jpg' rel='photonic-prettyPhoto[1]'><img src='image3-thumb.jpg' /></a>

	<a href='image4.jpg' rel='photonic-prettyPhoto[2]'><img src='image4-thumb.jpg' /></a>
	<a href='image5.jpg' rel='photonic-prettyPhoto[2]'><img src='image5-thumb.jpg' /></a>
	<a href='image6.jpg' rel='photonic-prettyPhoto[2]'><img src='image6-thumb.jpg' /></a>

Insertion Scripts

While the basis of the plugin is the tweaking of a shortcode, it can get challenging to remember all the different parameters of the shortcode. So Photonic bundles an insertion script with the Add Image media button in your admin panel:

Click on the "Add Media" button

Click on the “Add Media” button


Click on the new "Photonic" tab

Click on the new “Photonic” tab


Click on the individual tabs for Flickr, Picasa etc.

Click on the individual tabs for Flickr, Picasa etc.

Support

The plugin is distributed through the WordPress plugin repository and is supported on the Support Forum by volunteers, and on the WP Support Forum by me.