ocPortal Tutorial: Providing galleries

Written by Chris Graham, ocProducts

A gallery system is provided for the storage, organisation and viewing of images and videos. The gallery serves much like a gallery in reality: as a direct presentation medium. This tutorial describes the basic gallery features, and how to use them.

Table of contents

ocPortal Tutorial: Providing galleries
1. Gallery structure
2. Galleries
3. Gallery index
4. Watermarking
5. Teasers
6. Videos
7. Ordering
8. Slide-shows
9. e-cards
10. See also

Gallery structure

Viewing a gallery that has a subgallery

Galleries are organised in a hierarchical (tree) structure. For more information of these tree structures, see the 'Providing downloads' tutorial, as the download system is the perfect clean example of an ocPortal tree-structured system. The gallery structure is more complex than that of the download structure, and additional information on it is given in the 'Advanced galleries' tutorial.

Galleries may have 'representative images' (rep-images). When a user views a gallery with sub-galleries, the sub-galleries are actually shown with their rep-images, so as to make them look more attractive and give an impression of the contents. Rep-images may be chosen when adding or editing a gallery, or when adding an image to a gallery it can be chosen that that image shall also become the rep-image.

Galleries

A gallery in flow mode

A gallery is a category of the gallery system, and is used to hold images and videos (together, gallery entries). Galleries can also hold audio files which are treated in the same way as videos.

Galleries are given a name, and a title. The name should be a code-name that can easily be typed in a URL, rather than a cleanly readable name. For example, 'holiday2004' would be a good gallery name for a gallery with title, 'Holiday Pictures, 2004 (Sweden)'.

A gallery in multi-page mode

There are two display modes for galleries:

Flow mode – this mode allows you to see all the entries in the gallery at the same time as viewing one of the entries. This makes navigation more efficient
Multi-page mode – this mode provides page browsing features so as to be able to browse through a large numbers of entries

From the gallery, the user can choose any of the available entries (images or videos), and the chosen entry will be presented to the user on a full wide page.

Gallery index

A gallery index is provided that lists all galleries in the system. Galleries that are empty are omitted from this list.

The index is not linked onto the menus by default but may be added via the entry-point finder in the menu editor if you want it.

Watermarking

When you add or edit a gallery you may choose watermarks to be automatically added to any of the 4 corners of any added images that you select to be watermarked. A watermark is just a semi-transparent image that is overlaid across images as an official mark, or to prevent unauthorised reproduction. If you wish to place a watermark on an edge, you simply make a corner watermark image that includes enough transparency to change the location for the main image to be placed.

Watermarks are actually 'inherited' in the tree structure: in other words, when adding an image, watermarks will be chosen from the first gallery back down towards the root gallery that actually defines watermarks.

Teasers

Viewing a gallery image

For various kinds of website, such as expert photography communities, galleries provide a place to position premium or important content. ocPortal forms a 'teaser' system, whereby you can encourage users to join a certain usergroup (perhaps, via some form of subscription) that has access to view certain galleries, by 'teasing' them about them. You can define 'teaser' text for each gallery, and use the :tease page to display it, other details, and the rep-image, to those without access.

Videos

Galleries have powerful video support. ocPortal will analyse the file types of uploaded videos and use carefully crafted templates that use browser plug-ins that are most appropriate to that file type. For example, QuickTime files will be displayed with HTML to use the QuickTime plugin.

ocPortal can usually auto-detect video widths, heights and lengths, from the actual video files.

Ordering

Adding an image to a gallery

Gallery entries are ordered in the same order they were added to the system. If you are batch importing (covered in the Advanced Galleries tutorial), then you may want to define a custom ordering. To do this, you just need to give all the images in the batch names that are consistent with a numbering scheme of your choice. ocPortal will detect numbering schemes automatically, and order by them.

The rule is very simple: ocPortal will order by file-name if when taking all numbers out of all file-names in the gallery, the file-names are all the same.

For example, a gallery with the following named files would not be ordered according to a scheme:

foo.png
foo1.png
foo2.png
foo2something.png

But without the last image, the contents would be ordered by file-name.

Slide-shows

When viewing an image or video visitors will be able to start moving through all the subsequent images/videos in the gallery automatically. This is referred to as a slide-show. Visitors may pause the slide-show via a click or keypress, which could be triggered via a hand-held USB control device (as such devices can be mapped to such input actions).
If you would like to change the speed of the slide-show you can do it via editing the GALLERY_ENTRY_SCREEN template.

e-cards

When viewing an image visitors will have an option (if the 'recommend' addon is installed) to send the image as an e-card. This is a good form of website promotion, as the e-card also functions as a kind of website recommendation.
If you don't want this feature you can remove it by editing the GALLERY_ENTRY_SCREEN template.

Concepts

Gallery: A category for images and videos
Rep-image: An image chosen to represent a category, when a box for it is displayed
Teaser page: A page that only shows gallery rep-images and details, intended for sites where the gallery requires subscription (stock art sites, auction sites, etc.)
Watermark: A standard mark shown on an image to mark its identity, often done for a number of different reasons
Flow mode: The gallery view mode intended for attractive display of small galleries
Subgallery: A gallery placed beneath another gallery