C068 2-Column w/ Image Right

Layout Variant: C068

Content Type: Collection

Aspect Ratio: 

• 2:1 for main image in C067 component

Expected Use:

Use this component to highlight two product features or proof points and add visual style to a page. The header text can serve as the key value prop and/or speak to the general purpose of the product or service offered. The offerings listed in the two columns should feature relevant icons that follow Emerson iconography. The subtitles for offerings should show one to two words that explicitly state the service, and a short sentence with further detail should follow.

Building the Component:

Similar to the other flexible column components, the C068 can be built with two collections of C071 teasers when you have many points to make or simply use two C071 teasers in the Items list of the C068 directly. If you wish to use a single teaser or single column of teasers you should use the C070 component or another single column component design. The primary expected use case is for a simple component that has two teasers. You can find other components for more complex use cases (C070, C067).

• Teaser Title - this is the tile headline of the component.
• Teaser Text - there is no body copy or sub-headline for this component
• Pictures and Media - this is the image shown on the right of the component
• Items - you can add C071 teasers directly or two collections of C071 teasers. If you wish to include a C072 footnote, it should be included in the Items List of the C068 Collection.
  • Adding Teasers directly to the C068 Items List - simply add two teasers to the Items List. While it is possible to add just one teaser, this is not the intended usage and does not look well balanced.
  • Adding Collections to the C068 Items List - you can also add two collections to the Items List. This allows two columns of teasers to be added to your component. The collections do not have a Layout Variant (set to Default). You can have any number of C071 teasers in each of the two collections. While it is possible to add just one collection, this is not the intended usage and does not look well balanced.
• CTAs - You may add one or two CTAs to the bottom of the component by selecting the "Use Linked Call-to-Action Label" and adding a teasable item (or items) that have defined CTAs. To use two CTAs and define them, you will need to select "Use Custom and Linked Call-to-Action Lablel".
• Background Color - Can be set to "Default" (white), "Legacy" (gray), or "Secondary" (dusty blue or other secondary color defined in the CSS for an extended site).

Also see C069 and C070 for additional variants of this component. Note: The C072 Footnote does not work with this component layout

GOVERNANCE: The use of this component is not a standard selection for most approved layouts and should be discussed with your platform lead before using. Further, the use of icons in any use case of this component must also have governance approval before publishing. If you feel you have a different use case than shown here you must seek governance approval from your platform leader.

Creating C071 Teasers for callouts:

• Create a new Teaser
• Add a Teaser Title for the heading of the callout
• Add Teaser Text
• Optional: Add Picture (icon). Again, note that the icon should be representative of and add value to the text in the callout. 
• Set the Layout Variant to C071

Creating C072 Teaser Footnote (optional):

• Create a new Teaser
• Add your footnote information to the Teaser Text
• Set the Layout Variant to C072