Article-Modul

Define your Content

Die gängiste Form des Moduls ist der Artikel. Hier werden Texte dargestellt und mit Bildern untermalt.

Wie jedes Modul hat der Artikel eine Reihe an Keywords, die in der Page-Datei verwendet werden können. Neben den Keywords für den Modul-Header headline, subheadline und introtext und den options wird insbesondere der Inhalt übergeben.

Generell wird der Inhalt als Markdown mit der Markdown Extra-Erweiterung gerendert. Es ist also auch möglich dem Inhalt direkt HTML-Code zu übergeben, sollte dies nötig oder praktikabel sein.

Module, wie das Artikel-Modul, die vorwiegend Text-Inhalt ausgeben besitzen das content-Keyword. Hier wird ein stringübergeben und durch den Markdown-Compiler übersetzt. Endet der content auf die Endung .md wird relativ zum pages-Ordner nach einer Markdown-Datei gesucht und diese übersetzt. Das ist hilfreich bei langen Texten. wie dem Impressum oder der Datenschutzerklärung. Hier wird die Datei mit dem Pfad relativ zum pages-Verzeichnis übergeben.

Die beiden Keywords funktionieren auch zusammen, wobei die Datei zuerst gerendert wird.

Der Artikel besitzt das image-Keyword mit dem ein Artikelbild festgelegt werden kann. Das Bild wird relativ zum images-Ordner angegeben. Die zugehörige Option heißt imagePosition. Damit wir die horizontale Ausrichtung des Artikelbildes ganz einfach verändert. Mit dem Keyword imageDescription lässt sich eine Bildunterschrift hinzufügen. Das responsive Verhalten des Artikelbildes ist bereits angelegt. Bilder können zusätzlich direkt im Text per Markdown eingefügt werden. Siehe hierzu das Beispiel auif der Startseite.

Über die class-Option können dem Artikel (und jedem anderen Modul) beliebige Modulklassen übergeben werden. Besonders mächtig ist das im Zusammenspiel mit dem Bootstrap-Utilityklassen. Mit diesen lassen sich viele Eigenschaften einfach üer die Page-Datei einstellen, ohne das Modul-Template oder die Stylesheets zu verändern.

Spezifisch für das Artikel-Modul ist die Klasse column-count-2. Damit wird der Artikel-Text in ein Zwei-Spalten-Layout gesetzt. Beispiele dafür finden sich ebenfalls auf der Startseite.

Beispiel-Code für dieses Modul:

'article' => [ 'headline' => 'Article-Modul', 'subheadline' => 'Define your Content', 'introtext' => 'Die gängiste Form des Moduls ist der `Artikel`...', 'image' => 'placeholder.jpg', 'imageDescription' => 'Beispiel-Bildunterschrift', 'content' => 'Wie jedes Modul hat der Artikel eine Reihe an Keywords, ...', 'options' => [ 'class' => 'article-class', 'imagePosition' => 'left' ]
]
Beispiel-Bildunterschrift