Captioned Photo

Captioned photos are used to provide additional information about a photo that is associated with the photo and is not a part of the rest of the flow of the page text.

This component has a UO Edit Suite template for easy use on Drupal Sites: How to use this template

Examples and Code

Select exampleDefault

Open Full Example

<div class="caption-photo">
  <div class="caption-photo__photo">
      <img src="/test-image-landscape.jpg" alt="Test Image" />
  </div>
  <div class="caption-photo__caption">
      Photo Caption
  </div>
</div>

Guidance

When to Use Captioned Photos

• To clarify the subject or meaning of a photo: If your photo is of a person or people, clearly identify them. If the photo displays a complex subject, such as a research specimen or such, clearly identify that subject.