Textelemente

Mit Textelementen integrierst du unterschiedliche Textinhalte auf deiner Seite. Contao bietet dafür spezielle Elemente an, die für die Verwaltung im Backend optimiert sind und im Frontend korrekte Ausgaben liefern. In den folgenden Abschnitten werden die Eigenschaften der einzelnen Elementtypen beschrieben und erklärt.

Überschrift

Das Überschriftenelement fügt Ihrer Seite eine einzelne Überschrift hinzu. Sie können die Ebene der Überschrift von h1 bis h6 festlegen.

Die erste Überschrift auf dieser Seite wurde mithilfe eines Überschriftenelements mit der Ebene h1 erstellt.

Dieses Element musst Du allerdings nicht unbedingt verwenden, um Deiner Seite eine Überschrift hinzuzufügen. Fast alle anderen Elemente verfügen über ein zusätzliches Eingabefeld für die Überschrift, das ebenfalls die Ebenen h1 bis h6 bietet.

Text

The text element provides a rich text editor in the back-end allowing you to format the text output in the same way as popular office software. You can set words or phrases in bold or italic or add underlining and integrate (hyper) links to other pages of the same website, links to files or file downloads or external URLs to name just a few features of the utilized tinyMCE editor.

The element also allows to add a single image which can be positioned relatively to the text. The image can be placed above or below the text or placed floating left or right of the text. You are able to choose from several options to modify the picture, e.g. resizing or even cropping it and to add a link to a contao page, to an external URI or to a full resolution version of the image. You can define wether the linked page will be opened in a new window or tab of your browser. The full resolution version of the image will be opened in an overlay on the same page if defined that way in the page layout.

HTML

Über das HTML-Element lässt sich reiner HTML-Code eingeben.

Die erlaubten Tags müssen in den Contao-Einstellungen im Abschnitt Sicherheit definiert werden. Die meisten HTML-Tags sind standardmäßig erlaubt. Einige sicherheitsrelevante Tags wie 'script' müssen bei Bedarf manuell hinzugefügt werden.

Definitionsliste Beispiel
Erstellen Sie es mit dem Contao-Inhaltselement HTML.
Sie können bei Bedarf noch viele weitere HTML-Tags verwenden.

Liste

Um geordnete oder ungeordnete Listen als einzelnes Element einzufügen - nicht innerhalb des Textelements - stellt contao das Listenelement zur Verfügung. Über ein spezielles Backend-Widget kannst du jeden Listeneintrag über ein einzelnes Eingabefeld hinzufügen, die Einträge sortieren, neue Einträge einfügen oder kopieren.

Beispiel für eine geordnete Liste

  1. Beispiel 1 für eine geordnete Liste
  2. Beispiel 2 für geordnete Listen
  3. Beispiel 3 für geordnete Listen
  4. Beispiel 4 für eine geordnete Liste

Beispiel für eine ungeordnete mehrstufige Liste

  • Beispiel für eine geordnete Liste
  • Beispiel für eine geordnete Liste
    • Beispiel für eine geordnete Liste
    • Beispiel für eine geordnete Liste
      • Beispiel für eine geordnete Liste
  • Beispiel für eine geordnete Liste

Ungeordnete Liste Beispiel

  • Ungeordnete Liste Beispiel 1
  • Ungeordnete Liste Beispiel 2
  • Ungeordnete Liste Beispiel 3
  • Ungeordnete Liste Beispiel 4

Tabelle

Um eine Tabelle zu erstellen, können Sie das Tabellenelement verwenden. Contao bietet ein spezielles Backend-Widget, ähnlich dem für Listen, um Spalten und Zeilen hinzuzufügen, eine Kopf- und Fußzeile zu definieren und eine Zusammenfassung für den Tabelleninhalt hinzuzufügen. In der Frontend-Ausgabe können spezielle Klassen ausgewählt und der Tabelle, den Zeilen und Zellen hinzugefügt werden. Überprüfen Sie einfach den HTML-Code der Seite Inhaltselemente, um die möglichen Klassen zu erkunden.

Zusätzlich kann eine Sortiermöglichkeit für das Frontend hinzugefügt werden, um die Tabelle nach allen Spalten sortierbar zu machen.

Beispiel

Head 1 Head 2 Head 3
Spalte 1 Spalte 2 Spalte 3
Spalte 1 Spalte 2 Spalte 3
Spalte 1 Spalte 2 Spalte 3

Code

Um einen Ausschnitt eines Programmcodes wie z. B. PHP oder JavaScript bereitzustellen, verwenden Sie das Code-Element. Der Code wird nicht im Frontend der Seite ausgeführt.

<script>
  alert("Hello World!!");
</script>

Markdown

Seit Contao 3.3.x wird Contao mit dem Markdown-Inhaltselement ausgeliefert.

Was ist Markdown?

Markdown ist eine Auszeichnungssprache mit einfacher Textformatierungssyntax, die so konzipiert ist, dass sie mit einem gleichnamigen Tool in HTML und viele andere Formate konvertiert werden kann.

Aus wikipedia

Mehr erfahren