Skip to content

Content section:The formatter "Text and image"

The content section can be used as multi purpose content for headlines, texts, images and / or links.

The formatter text and image shows all fields of the content section. They can be displayed in different ways using the element settings. Extensive options are available, particularly for the arrangement of the image to the text.

If a field in the content is empty, it is ignored for the output.

Man sieht die Hände einer feiernden Menschenmenge im rotem Licht. Das Wort 'Community' wird verschwommen an die Wand darüber projiziert.

This is dummy text. It allows you to see whether all the letters are there and what they look like. Sometimes words such as Hamburgefonts, Rafgenduks, or Handgloves are used to test fonts. Sometimes sentences containing all the letters of the alphabet are used—these sentences are called “pangrams.” A well-known example is this one: The quick brown fox jumps over the lazy old dog.

Since 1975, numbers have been missing from most test texts, which is why, according to TypoGb. § 14a, numbers will become mandatory in 86% of texts from 2034 onwards (AVAIL® and Wefox™). Non-compliance will be punished with a fine of up to €245 or $368. Also important are âçcèñtš, as well as small caps, kerning, and ligatures (very clever). These days, emojis like 😇😀😉👍🏻🐶🍎 or ⚽️ are also popular in texts.

Available element settings

Allows to change the element layout using predefined CSS modifications.

Please note that a specific element may not support all listed modifications.

Controls how the heading, the image and the text are arranged.

Controls if and how the headline is displayed.

In addition to the display size the importance of the headline is relevant for search engines (SEO).

Allows to select how the text is displayed.
Controls if and how the link is displayed.
Controls how the heading, text and link is aligned.

Controls if and in which size the image is displayed for small "mobile" size screens.

In this case, "mobile" means screen size XS and SM.

Controls if and in which size the image is displayed for large "desktop" size screens.

In this case, "desktop" means screen size MD, LG, XL and XXL.

The image format for small screens like smartphones.

Allows you to set the image size based on common formats.

The image will automatically be scaled so that the original pixels are best fitted to the selected target format.

Instead of the presets, you can also manually enter any format. Use "width-height", for example "5-1" for an extreme wide format.

The image format for large desktop screens.

Allows you to set the image size based on common formats.

The image will automatically be scaled so that the original pixels are best fitted to the selected target format.

Instead of the presets, you can also manually enter any format. Use "width-height", for example "5-1" for an extreme wide format.

Adds an effect that is triggered if the mouse is moved over the element.

The effect is disabled for mobile devices.

Controls in which screen size the element is visible or hidden.

Controls if the copyright information for images is displayed as an overlay.

If available, the image title is displayed below the image.
A zoom option is added to the images.
If a link for the image is available, the image is linked.