Carnegie Mellon University

CMU Web

A service provided by the University CMS Team

Photo Grid

Display an array of photos in a grid layout with options to overlay text and add links.

Example of a photo grid.

Example of a photo grid.

Configure the Photo Grid

  1. Using a grid, for Type select Photo
  2. Select the Number of Columns to display
  3. Complete the fields for HeadingGrid ID and Style (optional)
  4. Add photos
    1. For each photo, add a Section ID (optional) if you want to link directly to this section of the page
    2. Choose File to select the image; you may browse for or upload the image
    3. Enter a description of the image for Alt Text
    4. Enter the fields for Headline and Text to overlay the image (optional)
    5. Add a Link (optional); Choose File to select a page or file on your site, or URL to link to an external site
    6. If link was added, enable Open in New Window if linking to an external site or to a document such as a PDF
    7. Click the plus sign (+) to add another photo, repeat steps a-g

Configuring a photo grid in the user interface.

Photo grid settings in the page edit interface.