Content with Aside component

 


Preview

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam lobortis elementum felis, ac facilisis nisl. Vestibulum id est nulla. Ut dignissim luctus nunc, eget elementum lorem commodo non. In hac habitasse platea dictumst. Nunc a est a odio pharetra malesuada. Phasellus nec diam eu ex ultricies tincidunt. Nam et erat pharetra, interdum felis vel, porta massa. Proin cursus, dolor id ultrices tincidunt, tellus orci vulputate ipsum, vitae rhoncus enim nibh eget augue. Proin nec leo non dolor tincidunt ultrices. Aenean bibendum urna ac euismod pretium.

Quisque ut nunc vitae nunc tincidunt convallis a sed dolor. Proin ut erat scelerisque, fermentum purus vitae, congue lacus. Mauris ac ipsum vitae mauris mollis rhoncus.

Maecenas nibh quam, maximus nec massa vel, vehicula ultricies nulla. Nam facilisis maximus tortor sit amet iaculis. Integer a metus vitae ligula semper porta ac non ipsum. Pellentesque non interdum massa. Ut tincidunt, massa dapibus vehicula iaculis, sapien justo scelerisque felis, eu mattis tortor diam id urna. Duis non pharetra mi. Suspendisse sed turpis erat. Donec odio libero, consectetur non dolor sit amet, interdum porta risus. Praesent facilisis vehicula diam, at tincidunt justo suscipit nec. Nulla scelerisque quis lorem et tempor.

Key figure

 

 

Information architecture

The Content with Aside component allows to create a layout with a large content column and small aside.

Content with Aside component is used by default for all Business Case CTs.

Design

Aside has left or right alignment variations.

In the mobile version, the aside=left is displayed above the Main content and the aside=right is displayed below the main content.

Verical line can be displayed as separator between Content and Aside blocks.

Typical usage and example

To be used for: business case template, description of a video, key figures near a text

See an examples:

https://www.veolia.co.uk/press-releases/veolia-peterson-collaborate-allseas-major-northern-north-sea-decommissioning-project

https://www.veolia.co.uk/services/smart-water-systems-and-services#h5o-8

https://www.veolia.co.uk/case-studies/heineken

 


How to create it

Field Description
1 - Admin title Used only in the backoffice
2 - Background Color behind the component: white or grey
3 - Display a vertical separator Grey vertical line will be displayed between Content and Aside blocks
4 - Content Defines the components and medias to display in the Content block.
5 - Content Defines the components and medias to display in the Aside block.

Warning

Due to the specific Youtube and Vimeo layout constraints, video component can't be included in the Aside column.