Mixed Media: Image
This component displays a single image.
![](https://corporate.bclc.com/documentation/design-system/components/mixed-media--image/_jcr_content/root/responsivegrid/section_container/image.coreimg.jpeg/1583778116205/soc-firefighters.jpeg)
Usage Criteria
This component displays an image and has the options of displaying a caption and linking out to a different page.
Do's and Don'ts
- Use this component with the Mixed Media: Image Gallery component when there are multiple images to display.
- Avoid using multiples of the Mixed Media: Image component stacked side by side (unless that is the intention).
Design Notes
When displaying multiple images, repeating this component and grouping them will make a page excessively long. Instead, use the Mixed Media: Image Gallery, which puts the images into a slider.
Configurable Options
This image component has the option of showing or hiding a caption. The caption can be manually entered or automatically retrieved from the DAM via a checkbox.
Adding a link will make the image clickable. There is also a checkbox to make the image downloadable when paired with the Mixed Media: Image Gallery and in fullscreen mode.
Developer Notes
Type |
Name |
---|---|
AEM Component Name |
Mixed Media: Image |
Code Base Name |
image |
resourceSupertype |
core/wcm/components/image/v2/image |
SCSS Attributes |
|
JavaScript |
|
Status |
Released (RC 1) |
Version |
Code Base v1.0 |
Designer Notes
Type |
Name |
---|---|
Sketch Component Name |
BCLC_Corporate_Designs/components/mixed-media/image-gallery |
Sketch Responsive Sizes |
Desktop HD, Desktop, Tablet, Mobile |
Status |
Released (Master) |
Version |
Design 1.0 |