toujou
+49 911 23980-870

Text elements with media

Texts with adjacent media: integrated, beside, above or below.

Item-IDs: 01-002 | 01-003 | 01-004 | 01-005 | 01-009 | 01-010 | 01-011 | 01-012 | 01-013 | 01-014 | 01-017 | 01-018

Sample views  Step by step guide  Screen adaptation


Sample views

Single column with media inside

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.

Multiple

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

column

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

with media

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

below

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


Step by step guide

Create text field

  • Click on the + Content button to create any text element.
  • In the Text Elements tab, select the element of your choice that contains text and images and is named accordingly.

Insert and format text

  • Paste your text into the editor or into each editor per tab from left to right for multiple-column elements.
  • If you copy the text from another file, pay attention to possibly copied formatting.
  • The text can be formatted directly within the rich text editor, with the help of the menu above the editor.

Insert media

  • Click on the button Add image.
  • Select an image file from your file list or upload a file to the appropriate folder (Select & upload files).
  • To insert a video/multiple videos, click Add media by URL in the General tab.

Format image

  • Any image information and links can be entered directly in the Image Metadata workspace.
  • The ratio and size of the image can be adjusted in the Image manipulator by clicking Open Editor.

Screen adaptation

Text elements with media only reflect the content you inserted.

Depending on the theme and the type of element, the grid width varies. All of the elements represent regular text content plus media and content such as links, formatting and tables.

In multi-columned text elements, you determine the text contents per column and there is no automatic overflow. Multiple columns (except for Two text blocks with media) take the maximum content width.

Responsive behaviour: If there isn’t enough space to display columns next to each other, the first paragraph is displayed over all adjacent paragraphs. On small devices, all left-to-right paragraphs are displayed above each other from top to bottom. All media (except for text elements with media below) will be ordered above text blocks the smaller a display becomes.


Linked topics

toujou set-ups & TYPO3 tutorials related to this element description.

Text editing  Image editing  Filelist