Vorlagen und Komponenten

Ein Datenbank-gestütztes Content Management System wie Consentio ermöglicht die Eingabe von Daten und die mannigfache Darstellung derselben. Für die Darstellung und Aufbereitung der eingegebenen Inhalte sind Vorlagen verantwortlich. Diese bestehen in der Hauptsache aus HTML-Code und Platzhaltern für die Daten. Das CMS mixt die Daten nun mit den Vorlagen.

Beispiel:

HTML-Vorlage: <h1>&&&&title&&&&</h1>

wird bei Dateneingabe "Hallo Echo" für das Datenfeld "title" zu <h1>Hallo Echo</h1>

Die Vorlagen werden unter Einstellungen → HTML-Vorlagen angelegt und bearbeitet. Dieses Werkzeug dient zum einen der Modifizierung von vorhandenen HTML-Vorlagen als auch zum Erstellen neuer, wenn Sie eigene Plugins entwickeln.

Die Vorlagen sind in Untergruppen aufgeteilt, da die Fülle der benötigten Vorlagen leicht unübersichtlich werden kann. In der ersten Ebene wird zwischen Vorlagen unterschieden, die für die Benutzeroberfläche (GUI, das Backend) verwendet werden und solche, die für Erstellung der Webinhalte verantwortlich sind (CMS, das Frontend). Mit ersterem können Entwickler die Benutzeroberfläche den eigenen Bedürfnissen anpassen. Für die Adaptionen des Webdesigns sind ausschließlich Vorlagen der Gruppe CMS verantwortlich.

Die HTML-Vorlagen sind verschachtelt zu verstehen, das heißt das Ergebnis einer Vorlage plus Daten kann wiederum in eine übergeordnete Vorlage einfließen. Am Ende der Kette stehen die Seiten-Layout-Vorlagen, die unter CMS → BODY zu finden sind.

Komponenten

Die Links zu eigenen Social Media-Auftritten als Besispiel für eine Komponente, die händisch als Code bereitgestellt wird.

In den Seiten-Layout-Vorlagen sind Platzhalter für Komponenten eingetragen. Komponenten sind zum einen Endergebnisse diverser Funktionen, wie etwa der eigentliche Seiteninhalt, Teaser-Boxen, Inhaltsverzeichnisse aus dem Nachrichten-Plugin oder ein Karussell. Komponenten können jedoch auch unter Content → CMS-Einstellungen → Komponenten direkt hinterlegt werden. Damit ist sowohl das Einbinden einfacher Inhalte als auch von Javascript-Code möglich, etwa für diverse Social-Media-Anbindungen .

Der Unterschied zwischen Vorlagen und Komponenten ist der, dass Vorlagen immer mit Daten aus der Datenbank ergänzt werden, wohingegen Komponenten vorbereitete Inhalte darstellen, die in der letzten Stufe in die Seiten-Layout-Vorlagen gespeist werden.

Seiten-Layout-Vorlagen

Wie bereits erwähnt sind Vorlagen oftmals verschachtelt, um die diversen Ebenen abzubilden sowie eine gewisse Flexibilität in der Kombination zu gewährleisten. Auch Seiten-Layout-Vorlagen sind so zu sehen.

Sie bestehen neben Komponenten und sonstigen Schnippsel in der Regel aus:

  • einem HEAD-Bereich, der die Metadaten der Seite enthält sowie die Einbettung von Stylesheet- und Javascript-Dateien. Die Standard-Vorlage ist cms_head in CMS → HEAD (wie Sie sehen wird hier der durchaus ernsthafte Versuch unternommen, die Dinge möglichst übersichtlich zu gestalten.)
  • einem BODY-Bereich (zum Beispiel cms_pages_body1) zu finden unter CMS → BODY
    der wiederum beinhaltet:
    • den Kopfbereich (Standard: cms_pages_header)
    • den Titel (Standard cms_pages_title)
    • den Fußbereich (Standard cms_pages_footer)
      alle unter CMS → SECTION → PAGES zu finden

Die Kombination dieser Vorlagen wird in Content → CMS-Einstellungen → Vorlagen für die Layout-Vorlagen der einzelnen Seiten festgehalten.

Standardmäßig gibt es eine eigene exklusive Vorlage für die Startseite, sowie die für Seiten und Ordner zwei frei wählbare Vorlagen "Standard" und "Ganze Breite".

Sollten Sie vorhaben eine weitere Seiten-Layout-Vorlage zu erstellen, werden Sie zuerst in Einstellungen → HTML-Vorlagen eine Variation einer bestehenden Body-Vorlage erstellen und zum Beispiel mit dem Schlüssel cms_pages_body3 speichern. Klicken Sie unter Content → CMS-Einstellungen → Vorlagen auf den Reiter "Neue Vorlage hinzufügen". Anstelle von "cms_pages_body1" geben Sie nun "cms_pages_body3" ein und speicher die Vorlage unter einem aussagekräftigen Namen. Sie können nun die Vorlage für Ihre Seiten und Ordner bei Bedarf auswählen.

In der Regel wird es reichen ausschließlich den Body-Teil zu modifizieren. Mit dem Austausch aller anderen Teile kann man innerhalb der Website vollkommen eigenständige Bereiche schaffen bis hin zu Microsites oder Landing Pages mit eigenem Aufbau und Design.

Davon abgesehen gibt es für gewöhnlich zwei  Fälle, weshalb man eine neue Vorlage schaffen will:

  1. ein abweichendes (Spalten-) Layout
  2. eine abweichende Einbindung von Komponenten
Screenshot

Eine Vorlage bearbeiten

Komponenten der Seiten-Vorlage

Insbesonderes Augenmerk gilt hier der Body-Vorlage für die Startseite "cms_body_pages_start". Wie jede andere Seiten-Vorlage beinhaltet sie auch den Platzhalter &&&&MYCONTENT&&&&, der den eigentlichen Seiteninhalt einbindet. Plugins wie das Nachrichten-Modul oder das Karussell zielen darauf ab, Komponenten für die Startseite zu generieren, die sich durch Änderungen in diesen Modulen automatisch anpassen. Dadurch entsteht Veränderung auf der Startseite, ohne diese selbst bearbeitet zu haben.

Welche Komponenten verfügbar sind – dies hängt von den hinzugefügten oder selbst entwickelten Plugins ab – wird in "HTML-Vorlagen" links im Komponenten-Register angezeigt. Mit einem Mausklick auf die gewünschte Komponente, wird diese an die aktuelle Cursor-Position im Editor eingefügt.

Wenn Sie eine neue oder veränderte Vorlage speichern, werden die Veränderungen erst bei der nächsten Aktualisierung umgesetzt. Dazu kann man auch auf "Website neu generieren" klicken.

Aktualisierungen finden ansonsten mit jeder Speicherung von CMS-bezogenen Daten statt, sowie periodisch durch den Cron-Job.