toujou
+64 273 868 404

Single and multiple media elements

One single medium or up to four media in a row centered on the page.

Item-ID: 05-001 | 05-005 | 05-008 | 05-009

Sample views  Step by step guide  Screen adaptation


Sample view single

Sample view multiple

To display third-party videos, we need your consent.

For more information, please see our privacy policy.


Step by step guide

Create media element

  • Click on the + Content button to create any media element. In the Media tab, select the element of your choice.
  • Choose the element according its grid design (two/three/four); there is no limit within the slider and gallery element.

Insert images

  • To insert an image, click Add media file in the General tab.
  • Select an image file from your file list or upload a file to the appropriate folder.
  • Repeat this step for multiple images.

Image information

  • Any image information and links can be entered directly in the Image Metadata workspace.
  • Activate the Description (Caption) by checking Set element specific value (No default) to add a caption to the image. Write the text into the field provided.

Format image

  • The ratio and size of the image can be adjusted in the Image manipulator by clicking Open Editor.
  • For more information on how to work within the image editor, go to the detailed tutorial.

Insert videos

  • Click on the + Content button to create any media element. In the Media tab, select the element of your choice.
  • To insert a video/multiple videos, click Add media by URL in the General tab.
  • Paste the full URL of a YouTube or Vimeo video into the mask that appears in an overlapped window.

Note on GIF: This data format can be uploaded from the file list just like an image described above. Make sure to use the correct format. For website performance reasons, we advise you to use it sparingly and to keep the data size as small as possible, as it will be displayed in its original size.


Screen adaptation

Media are single or multiple images or videos.

Responsive behaviour: The images or videos are fully displayed at a fixed ratio for each available screen size. Any three media elements are always displayed in a row. On small devices, four media elements are displayed in rows of two.


Linked topics

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

Image editing  Filelist