Engage reader with Image with text component

Image with text component, what is it and how to utilise it in visualising your pages and getting your messages through? Read on!

Image with text component

The Image with text component presents a specific content in an engaging way. The component has two Media (image) placements:

  • Media on the right, or
  • Media on the left, both including either
  • a Default or an Adaptive setting.

See below for examples of how the image and long text behave with the different settings.

It is recommended to use both placements if you use this component several times on the same page.

Three students sitting next to a wooden table, and studying. Two of them have laptops in front of them. Photo: Unto Rautio
Image with text component with Media placement: Default image on the right

Title

This is the Image with text component with Media placement: Default image on the right. This setting will maintain the original image ratio, irrespective of the length of the text next to it. Longer text will wrap under the image.

This component can include the basic formatting as available in the tool bar.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Three students sitting next to a wooden table, and studying. Two of them have laptops in front of them. Photo: Unto Rautio
Media placement: Adaptive image on the right

Title

This is the Image with text component with Media placement: Adaptive image on the right. The adaptive setting will stretch the image in relation to the text next to it. Longer text will not wrap under the image. This setting is recommended to be used for decorative images, that don't have a real focal point.

This component can include the basic formatting as available in the tool bar.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Three students sitting next to a wooden table, and studying. Two of them have laptops in front of them. Photo: Unto Rautio
Media placement: Default image on the left

Title

This is the Image with text component with Media placement: Default image on the left. This setting will maintain the original image ratio, irrespective of the length of the text next to it. Longer text will not wrap under the image.

This component can include the basic formatting as available in the tool bar.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Three students sitting next to a wooden table, and studying. Two of them have laptops in front of them. Photo: Unto Rautio
Media placement: Adaptive image on the left

Title

This is the Image with text component with Media placement: Adaptive image on the left. The adaptive setting will stretch the image in relation to the text next to it. Longer text will not wrap under the image. This setting is recommended to be used for decorative images, that don't have a real focal point.

This component can include the basic formatting as available in the tool bar.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

This service is provided by:

Communications Services

Did you find what you were looking for? If not, please contact us.
  • Published:
  • Updated:
Share
URL copied!