Skip to Content

Communications and Public Affairs

Gallery Callout

Help users browse through multiple images using a gallery callout. Choose from a thumbnail gallery or single thumbnail gallery presentation.

A gallery callout opens a lightbox so that a viewer can click through your images in a gallery. Creating a gallery callout requires two steps. First, you build the gallery. Next, you can place the gallery into one of two types of gallery callouts. Keep in mind that all images must include alternative text to be fully accessible. Review the Image Gallery Callout page on the Digital Accessibility site to make sure your content is inclusive.

Step One: Building Your Gallery

As you are building your gallery, be sure to use images that are the same orientation. Changing back and forth from vertical to horizontal images can be jarring for viewers. Use unique image captions to describe individual images, and avoid using a repeated general caption for all images.

Step Two: Select Your Callout Presentation

You lead viewers to your full gallery via a callout. Your callout can display multiple thumbnail images or just one larger image. Either way, once the viewer clicks on an image, it brings up the complete gallery in a lightbox.

An image gallery callout (top right) will display up to eight square thumbnails, any of which can be clicked to open the lightbox for the full gallery.

single image gallery callout (bottom right) displays the first image in the gallery with an overlaid bar indicating that the user can "View Images."

The headline bar on both gallery callouts has the option to include a category (in smaller type) and a headline (in larger type) as well as a caption where you can describe the gallery as a whole. All gallery callouts are only available with garnet headers. 


Challenge the conventional. Create the exceptional. No Limits.