Gallery Templates

When a gallery is added to an article or page, the content creator can choose from a list of gallery templates that will determine how the elements are displayed.  Site builders can set up multiple gallery templates with various configurations for content creators to use.

To edit or create new templates, go to Settings > Gallery Settings.

Gallery Template Types

Slideshow With Dot/Number Navigation
The gallery navigation will appear below the image and automatically adjust to either dots or numbers depending on the number of images included in the gallery. (There will be dots with fewer than seven images, numbers with seven or more.)
Example
Slideshow With Thumbnail Navigation
The gallery navigation will appear below the image as a strip of thumbnails cropped in a 1:1 ratio (square). The strip will include controls to allow a website visitor to navigate forward and backward through the strip.
Example
Slideshow With Paginated Thumbnail Navigation
The gallery navigation will appear below the image as a grid of thumbnails cropped in a 1:1 ratio (square).If there are more thumbnails than set in the grid settings, the website visitor will be able to move forward and backward through the grids of thumbnails through pagination.This type of slideshow is ideal for galleries with a large amount of images, such as user-submitted galleries.
Example
Mosaic With Overlay Slideshow
A mosaic of images will fill the space horizontal of the article in rows until all images in the slideshow are displayed. If a user selects to view an image, a full screen slideshow will allow the user to advance through all images in the mosaic.This type of gallery is ideal for galleries with five or fewer images.

Gallery advertising is not an option with this gallery type.

Example

Gallery Template Options

The Gallery Settings, where the templates are defined, also control gallery advertising.

 Dots/Numbers Navigation If chosen, the gallery navigation will configure itself automatically with dots or numbers based on the number of images. There will be dots with fewer than seven images, numbers with seven or more.
Thumbnail Navigation The thumbnail navigation can be configured to control the height of the strip of thumbnails. By default, the height is set to 100 pixels.
Paginated Thumbnail Navigation The paginated thumbnail navigation can be configured to set the number of columns and rows that display in the grid before it paginates.
Cropping Choosing “Yes” on cropping means all of the images in the gallery will be cropped to the same ratio and will fill the full width of the gallery area. The template will define that ratio. There is no default, but common ratios include 1:1 (square), 3:2, and 16:9.

Choosing “No” means all images will display at their original ratio in the largest size that can be displayed in the gallery area. The size of the gallery area is defined by the gallery height setting.

Limit Caption By default, the gallery will leave enough space between the image and the navigation to display the longest caption in the gallery. If one of the captions is quite long, this can cause a large amount of white space on most images in the gallery.

By selecting the Limit Caption setting, the space between the image and the thumbnail will be constrained. If a caption is too long to fit, a scrollbar will appear so website visitors can read the rest of the caption.

Row Height The height of each row can be set for Mosaic-style galleries.
Slide Position This shows the website visitor a set of numbers to indicate the number of the image the visitor is viewing and the total number of images in the gallery.

The Dots/Numbers navigation option and Mosaic-style galleries do not have a  Slide Position option.

Image Meta Information The following types of Image Meta Information can be set to display below the image:

  • Title
  • Caption
  • Long Description

The text in these fields is set in the Image Details area when the image is uploaded or edited in the Media Library. The Image Detail fields are shown in the image below.

 

Frequently Asked Questions

Do I get a pageview for each slide?

Yes.

I want to change the icons that are used for the arrows. How do I do that?

The arrow icons are defined using CSS. If you are interested in custom CSS for a gallery template, contact TownNews Support.

I want my thumbnail navigation to loop back to the beginning at the end. How do I do that?

While many of the navigational elements in the galleries loop, the thumbnail navigation includes a “back to the beginning” button at the end of the thumbnails instead.