Sulu CMS

Was ist Sulu CMS

Ein Content-Management-System ist eine Software, mit der man digitale Inhalte wie z.B. Texte, Bilder, Videos, oder Webseiten einfach erstellen und verwalten kann. Das Ziel ist es, alle Inhalte übersichtlich und zentral zu verwalten, statt jede Seite manuell in HTML zu programmieren und auf einen Server hochzuladen. Ein CMS sorgt also dafür, dass Inhalte für Webseiten oder Web-Apps übersichtlich und zentral verwaltet werden können.

Sulu ist ein Open Source CMS, das auf dem PHP-Framework Symfony basiert. Es richtet sich besonders an Unternehmen, weil es viele praktische Funktionen mitbringt. Man kann Inhalte und Designs zentral verwalten, mehrere Websites gleichzeitig betreiben (Multisite) und verschiedene Sprachen für die Seiten nutzen. So spart man sich viel Zeit, behält den Überblick und kann neue Seiten oder Änderungen schnell umsetzen.

Die Multisite-Funktion von Sulu ermöglicht es, mehrere Websites gleichzeitig zu verwalten. Dank der Webspaces lassen sich die Seiten schnell einrichten, konfigurieren und zentral verwalten, egal wie viele Websites es sind oder wie unterschiedlich sie aufgebaut sind. So behält man einen guten Überblick und kann jede Seite individuell anpassen, ohne dass der Aufwand zu groß wird.

Sulu ist standardmäßig mehrsprachig aufgebaut, sodass Inhalte für verschiedene Zielgruppen gleichzeitig gepflegt werden können. Das bedeutet, dass eine Seite bspw. gleichzeitig auf Deutsch, Englisch und Französisch verfügbar sein kann, ohne dafür separate Websites erstellen zu müssen.
Dank dieser Funktion muss man sich nicht um Datenbankeinstellungen oder mehrere Umgebungen kümmern, da alles zentral verwaltet wird. Änderungen an Inhalte können einfach auf allen Sprachversionen synchronisiert oder gezielt nur in einzelnen Sprachen angepasst werden.

Architektur

Sulu CMS ist ein Content-Management-System, mit dem man Websites verwalten kann. Es basiert auf dem PHP-Framework Symfony, welches das technische Grundgerüst bildet. Symfony sorgt dafür, dass Websites stabil laufen, gut erweiterbar sind und sich leicht zu warten und anzupassen bleiben.

Die Architektur von Sulu folgt dem Model-View-Controller-Prinzip (MVC).
Dabei hat jeder Teil eine klare Aufgabe:

Das Model kümmert sich um die Verarbeitung von Daten, z.B. Inhalte aus Datenbanken zu laden und zu verarbeiten. Die View übernimmt die Darstellung der Inhalte, um diese als Website anzuzeigen, die in Sulu mithilfe von Twig-Templates in HTML ausgegeben werden. Der Controller verbindet Model und View, verarbeitet Nutzeranfragen und sorgt dafür, dass die richtigen Inhalte angezeigt werden. 

Durch diese Trennung ist der Code übersichtlich aufgebaut, leichter zu verstehen und einfacher zu erweitern oder anzupassen.

Die Abbildung zeigt die Architektur von Sulu als mehrschichtig aufgebautes System. Auf der untersten Ebene befindet sich die Datenhaltung. Die Datenpersistenz erfolgt über Datenbanken, wobei MySQL, MariaDB und PostgreSQL bereits getestet wurden. Jedoch können auch andere Datenbanksysteme experimentell eingebunden werden.

In der mittleren Schicht sind die Frameworks dargestellt, auf denen Sulu aufbaut. Dazu zählt unter anderem das Symfony-Framework, das bereits zuvor kurz vorgestellt wurde.

Die oberste Schicht verdeutlicht den modularen Aufbau von Sulu. Es stellt verschiedene Module bereit, wie beispielsweise das Contacts-Modul zur Verwaltung von Nutzerdaten oder das Assets-Modul zur Verwaltung von Dateien, wie etwa Bildern, im Admin-Panel. Darüber hinaus kann Sulu durch eigene, benutzerdefinierte Module erweitert werden.

Struktur

Im Wesentlichen bestehen die Seiten, die man mit Sulu erstellen, konfigurieren und verwalten kann, aus mehreren Komponenten. Den Seitenbaum, woraus man auch die Navigation schließlich erstellen kann, nennt man Webspace. Die Webspaces bestehen aus sogenannten Pages, also Seiten, die man eigenständig im Admin-Panel der CMS aus Blöcken zusammenbaut. Dabei ist eine Page auch selbst ein Block, wo man weitere kleine Blöcke hinzufügen kann.

Struktur der Webseite im Admin-Panel

 

Die Blöcke muss man selber mithilfe von sogenannten Twigs programmieren. Dadurch kann man komplett frei entscheiden, wie die Blöcke aufgebaut sind und wie diese aussehen sollen. Anschließend kann man die Blöcke beliebig oft nacheinander in die Seite hinzufügen und füllen.

Beispiel für Text-Block mit einem Bild im Admin-Panel

 

Zusammengefasst kann man sagen, dass in Sulu eine Webspace aus mehreren Pages besteht, die wiederum aus Blöcken bestehen können.

Sulu gibt ein eigenes Beispiel einer Webseite vor. Diese ist unter der URL https://sulu.rocks aufrufbar. Auf derselben Seite stellen diese auch Zugriff auf das Admin-Panel zur Verfügung. Dieses findet man auf https://sulu.rocks/admin.

Templating

Um die Blöcke und Pages für die Webspace im Admin-Panel bereitzustellen, müssen diese erst selbst implementiert werden. Sie bestehen aus sogenannten Templates, die jeweils aus 2 Dateien bestehen: einer .html.twig-Datei und einer .xml-Datei.

Die XML-Dateien beschreiben dabei die Struktur der jeweiligen Elemente. Bei Blöcken wird beispielsweise festgelegt, aus welchen Properties sie bestehen sollen, wie z.B. Textzeilen oder -blöcken, Bildauswahlen, Dropdown-Menüs oder ähnlichen Elementen. Für Pages kann definiert werden, welche Properties sie enthalten und welche Blöcke innerhalb der Seite verwendet werden können.

Die Twig-Dateien bilden den gestalterischen Teil der Pages und Blöcke. Im Grunde handelt es sich dabei um normale HTML-Dateien, in die jedoch Sulu-spezifische Elemente eingebunden werden können. In den Twig-Templates lassen sich die einzelnen Inhalte der Properties sowie die Blöcke in Listenform, also untereinander, wie sie auch im Admin-Panel angeordnet sind, auf der Seite darstellen. Da Twig-Dateien im Kern HTML-Dateien sind, können zudem externe Bibliotheken und Frameworks, wie z.B. für CSS und JavaScript, eingebunden und verwendet werden.

Sulu stellt außerdem verschiedene sogenannte Bundles zur Verfügung. Dabei handelt es sich um von Sulu bereitgestellte Bibliotheken mit zusätzlichen Funktionen, wie beispielsweise das CommunityBundle für Login-Funktionen oder das FormBundle für die Umsetzung von Formularen.

Im Allgemeinen besteht eine Seite meist aus einer base.html.twig, die die Grundstruktur der Seite beziehungsweise den “Hintergrund” der Seite definiert und beispielsweise Header, Footer sowie die Navigation enthält. Der Inhalt der jeweils konfigurierten Page wird anschließend im Body dieser Basis eingebunden.

Sulu stellt für die Demo-Webseite zudem ein Projekt auf GitHub bereit, das öffentlich zugänglich ist und unter https://github.com/sulu/sulu-demo eingesehen werden kann.

BPMN

Vergleich mit anderen CMS

Stärken und Schwächen

Sulu CMS bietet zahlreiche Funktionen für die strukturierte Verwaltung von Webinhalten. Es basiert auf dem PHP-Framework Symfony und verfügt dadurch über eine stabile und erweiterbare Architektur. Das blockbasierte Inhaltskonzept ermöglicht einen modularen Aufbau von Seiten und eine klare Trennung zwischen Inhalt und Darstellung. Zudem unterstützt Sulu Mehrsprachigkeit, Multisite-Projekte sowie die Bereitstellung von Inhalten über APIs, wodurch sowohl klassische als auch Headless-Anwendungsfälle abgedeckt werden.

Allerdings gibt es auch Einschränkungen, über die sich Nutzerinnen und Nutzer im Klaren sein müssen. So setzt die Nutzung von Sulu grundlegende Programmierkenntnisse voraus, insbesondere im Umgang mit PHP. Im Vergleich zu anderen CMS stehen nur wenige fertige Erweiterungen zur Verfügung, sodass zusätzliche Funktionen häufig selbst implementiert werden müssen. Außerdem ist die Installation und der Betrieb technisch aufwändiger, da ein aktueller Software-Stack erforderlich ist und kein offiziell unterstütztes Docker-Image bereitgestellt wird.

Installation von Sulu

Von offizieller Seite wird kein Dockerimage oder dergleichen für die Basisinstallation von Sulu bereitgestellt. Es existieren verschiedenste Images von Privatpersonen oder Unternehmen, allerdings sind diese zum Teil nicht für den produktiven Betrieb gedacht oder setzen einen Vertrauensvorschuss gegenüber Dritten voraus. Entsprechend ist die einzige offiziell unterstützte Variante der Benutzung des CMS eine Installation direkt auf der Hardware oder in Form eines eigens aufgesetzten Dockerimages. In beiden Fällen läuft die Installation identisch ab. Zu Beginn ist es notwendig, das offiziell bereitgestellte Basistemplate eines Sulu-Projekts über den in der PHP-Welt verbreiteten Paketmanager Composer zu installieren.

composer create-project sulu/skeleton project-name -n

Durch dieses Template wird eine, bis auf Inhalt und Konfiguration, vollständige Installation Sulus bereitgestellt. Dem folgend ist es nötig, die gewünschten Webspaces in ihren zugehörigen XML-Dateien zu konfigurieren. Dabei werden beispielsweise der Name der Website, die zugeordnete Domain, etwaige Test- und Produktivumgebungen und Defaulttemplates der Seiten festgelegt. Zusätzlich zur Installation der Softwarekomponenten von Sulu muss eine Datenbank aufgesetzt werden. Durch die Nutzung von Doctrin ist die Wahl der verwendeten Datenbank relativ frei möglich. Nachdem eine Datenbankinstanz gewählt und aufgesetzt wurde, werden die Verbindungsdetails per Umgebungsvariable an Sulu übergeben.

DATABASE_URL=provider://user:password@host:port/database?serverVersion=version

Durch das der Installation beiliegende Skript “adminconsole” kann durch Übergabe der Parameter “sulu:build prod” die Grundstruktur der von Sulu benötigten Struktur in die Datenbank installiert werden. Ab diesem Zeitpunkt liegt eine vollständige und lauffähige Installation von Sulu vor, welche bereit ist, an die speziellen Anwendungsanforderungen angepasst zu werden. Dazu werden die im Abschnitt Templating beschriebenen .html.twig und .xml Dateien angelegt und mit Inhalt befüllt. Das installierte Template beinhaltet ein Skript, um einen einfachen Webserver zu starten. Dieser ist allerdings nur für Entwicklungszwecke gedacht und sollte keineswegs in produktiven Umgebungen genutzt werden. Die Sulu-Dokumentation selbst rät hier zur Nutzung eines Webservers wie Apache oder Nginx.

Quellen

https://sulu.io/

https://docs.sulu.io/en/3.0/book/getting-started.html

https://sulu.io/#powerful-2

https://www.ibm.com/de-de/think/topics/content-management-system

https://symfony.com/

https://docs.sulu.io/en/3.0/book/introduction/structure.html