Sidebar Image with Optional Caption

Layout Variant: C038 (Opt. Caption), C038B (Top Aligned Caption)

Content Type: Collection

Aspect Ratio: 

• Image 380 x 425 px

Expected Use:

This component is available for use with the Case Study layout like L026, C034, etc. Use optional caption copy to provide supporting information about the image and to add color to the case study and when you want to present a sidebar image with or without text in order to tell a small story.

Building the Component:

On the Content Tab, you can set the Layout Variant to C038 to display a Sidebar Image with Bottom Caption or if you prefer the Sidebar Image with Top Aligned Caption, set the Layout Variant to C038B. This component is specifically designed to support a Picture. Items and CTAs are not used for this component. This component can only be added to a Case Study Grid layout. Your Collection should contain the following:

• Teaser Title - The title for the featured image. 
• Teaser Text - This is the caption copy that provide support information on the image and case study. Caption is optional. If caption is used for the image, it should include a blue kicker followed by a short, summary paragraph about the case study. 
• Picture and Other media - This includes the featured sidebar image shown on the left side of the page.   

You can create an Internal Link Target (link to a content item in the Rich Text Editor menu) containing the link for C038-C038B in the left column of the Case Study 1x2 Grid by typing a text label (the text label is for reference only and will not show in the component) and then adding an Internal Link. Drag and drop the C038-C038B Collection on the Internal Link Target. Set the link to "Show Embedded".  

Adding a link to a "high res" version of the image

A primary use case is to allow for a hi res image for download in a news article so that it can be used by other media to syndicate the news. Due to the way CoreMedia handles Pictures, it is not possible to simply right click an image in a web browser and get the high res original image. You only get the displayed image at whatever size/aspect ratio that CoreMedia used for the component displaying the Picture.

To get a hi res version of an image you can do the following "hack". Create a Download Document type in Studio. Add the original image (jpg, etc.) to the Binary Data field of the Download. You can then add the Download to the end of your text in the C038 (Teaser Text) with a label such as "High Resolution Image" and have the Download "Open in New Window".  This will display your text as a hyperlink and allow the hi res image to open in a new browser tab when clicked allowing the user to save the hi res image.