November 04, 2009

Galleries, Image Rotators, Slideshows

There are several exciting things we can do with LiveWhale galleries.

LiveWhale can group together images into what it calls galleries.  These can be used in different ways in different places on your website. 

First off, what is a LiveWhale gallery and how do you add a new one? Most of you can see the “galleries” tab with you log into the Manage Your Content control center.  Clicking that tab takes you to the Manage Galleries page. 

Galleries in the News and Events

You can add images to your LiveWhale News and Events via the Images box on the right side of the News or Events edit screens.  These can be individual images or groups of images (i.e., galleries).  When adding galleries, you will find the end result has the first image is displayed on the upper right of your story or event (with the optional caption at the bottom) and left-and-right navigational arrows to take you through the photos you have placed in the gallery (with “image x of y”).  I have placed a demo gallery in this news story as an example; see it on the right?

Galleries in a Page: Image Rotators

With a little help from New Media, you can turn one of your galleries into a Image Rotator.  In this type of slideshow, a photo is prominently displayed (with its optional caption at its base in a gray bar) and other images from the gallery are shown at the bottom as thumbnails.  You can click on a thumbnail image to switch it to the prominent top display. The gallery itself can have a description displayed, and below that will be a link to “view full gallery” (discussed below).  I have built an example Image Rotator here to illustrate. (Note: generally, an image rotator cannot handle more than ten images before it runs out of room for the thumbnails.)

Full Gallery Displays

In addition to image galleries embeded within a story or page, you can also view galleries as free-standing entities. I have built a demonstration of this full gallery display. In it you will notice the gallery’s title and description at the top, followed by the first image with its caption.  Below that are the other images from the gallery in thumbnails larger than the image rotator.  Also this display can handle more image thumbnails than the image rotator.  To navigate, you can click on the “next/previous” buttons or click on the thumbnails themselves.

Displaying All Galleries in Your Group

You can also display a list of all your group’s galleries, which can then link to individual full gallery displays. Here is an example of that, showing all the New Media galleries. Note that galleries can be hidden from displaying by switching their status from “live” to “hidden” in the manage galleries area of the control center.