Image Gallery Snippet

This snippet will create a grid of thumbnail images that pop up into a scrollable gallery when a thumbnail is selected or a gallery of larger images that the user can scroll through that also pop up into a larger image. For the thumbnail option, only the pop-up image will display the title caption, but they will be displayed on the page for the gallery option.

An example of the thumbnails of an Image Thumbnails with Gallery widget.

An example of a gallery image of an Image Thumbnails with Gallery widget.

An example of the gallery style Image Gallery snippet.Image Gallery snippet.

  1. Using the Image Editor sidebar gadget crop the images.
    1. For the thumbnail option, crop a 170 Square and an 800 Banner, 1024 Feature, or 1600 Feature for each image. If you do not crop an 800, 1024, or 1600 image in addition to the 170, the thumbnail will not show up.
    2. For the gallery option, crop a 350 Sidebar, 800 Banner, 1024 Feature, or 1600 Feature for each image. If an 800 Banner or larger is cropped, clicking on the image will pop-up the image as well.
  2. Select thumbnail or gallery from the dropdown menu to select the gallery display type.
  3. Insert the image in the Image field.
    1. For the thumbnail option, insert the 170 square image.
    2. For the gallery option, insert the size that you want displayed on the page.
  4. Enter the title in the Title field to the right of the image, if desired. Linking this text will display a link on the pop-up image for the thumbnail option or both the page image or pop-up image for the gallery option.
  5. Enter the accompanying caption in the Caption field to the right of the title. Linking this text will display a link only on the page image for the gallery option. No links will appear in the pop-up images.

If you are including more than three images, press the Tab key to get more fields.