Contenido - Tabellen schön formatieren
Klassen und Styles für Tabellen in CMS_HTML mit TinyMCE
Ein bisschen Magie für einfach schöne Tabellen
Das Content-Management-System (CMS) Contenido ist ein einfaches System zur Pflege von Webseiten, das seit dem Jahr 2000 auf dem Markt ist. Ich ordne Contenido als System zwischen Wordpress und Typo 3 ein. Es ist konzipiert für eine einfache und überslichtliche Pflege von Inhalten, beherrsct Mehrsprachigkeit, eine differenziertes Rechtesystem etc., ist jedoch nicht so komplex wie Typo 3. Ich empfehle es für professionelle Webseiten mit hohem Anspruch, die in der Größe überschaubar sind (von 10 bis 5000 Seiten).
Im Gegensatz zu älteren Versionen nutzt Contenido 4.10.x TinyMCE 4; in Contenido 4.9.x ist es manuell aktivierbar. TinyMCE 4 und TinyMCE 5 erlauben es Tabellen in Text-Bereichen zu formatieren.
Für Fortgeschrittene und HTML/CSS-Kenner
Eine einfache Formatierungsmöglichkeit ist das einfügen von individuellen Style-Formatieren der Tabelle. Man klickt zunächst in die Tabelle, um diese auszuwählen. Dann wählt man im Tabellen-Symbol der Formatierungsleiste die Tabelleneigenschaften. Dort lassen sind rudimentäre Eigenschaften wie Breite und Höhe bestimmen. Im Reiter "Erweitert" findet sich das Eingabefeld "Stil" über den beliebige CSS-Style-Formatierungen für die Tabelle hinterlegt werden können.
Einfaches Formatieren mit Vorlagen
Die CSS-Eingeschaften sind allerdings beschränkt und nicht jeder Redakteur möchte CSS-Eigenschaften lernen und definieren. Speziell für diesen Fall gibt es die Möglichkeit in Contenido erweitere Konfigurationen für den WYSIWYG-Editor (What You See Is What You Get) zu hinterlegen und somit spezille Tabellen-Formatierungs-Vorlagen zu verwenden.
Als Contenido-Administrator eingeloggt, könnten unter [Administration] - [System] - [WYSIWYG] entsprechende Einstellungen vorgenommen werden.
Hinweis: Sollte der Punkt [WYSIWYG] nicht vorhanden sein (z.B. in Contenido 4.9 oder nach eine Upgrade), muss zunächst TinyMCE 4 aktiviert werden.
Dann kann im Bereich "TinyMCE 4-Konfiguration für CMS_HTML" unter "Zusätzliche Parameter (JSON, das an Tinymce bei der Initalisierung übergeben wird)" entsprechend eine Konfiguration im JSON-Format hinterlegt werden. Für Tabellen gilt die nachfolgende "table_class_list". Analog dazu können ebenfalls CSS-Style-Klassen für Bilder inder "image_class_list" hinterlegt werden
{
"table_class_list": [
{ "title": "", "value": "" },
{ "title": "Produkte", "value": "productTable"},
{ "title": "Informationen", "value": "informationTable"}
],
"image_class_list": [
{ "title": "", "value": "" },
{ "title": "Reponsive Fluid", "value": "img-fluid"},
{ "title": "Thumbnail", "value": "img-thumbnail"},
{ "title": "Zentriert", "value": "rounded mx-auto d-block"}
]
}
Ergebnis
Die Tabelleneigenschaften innerhalb des Editors wird durch die Formatierungs-Konfirguation um die Eigenschaft "Class" erweitert. Die Class-Eigenschaft fügt einer Tabelle eine CSS-Klasse beim Anzeigen der Seite hinzu, wodurch diese entsprechend vorformatiert werden kann.
Innerhalb der CSS-Dateien können so beispielsweise Überschritenspalten, Schriftformatierungen, alternierende Hintergründe und weiteres definiert werden. Sehr komfortabel und wieder einmal eine Stärke des CMS Contenido!
