Die großen Content-Management-Systeme – egal ob WordPress, Joomla!, Drupal oder Typo3 – basieren auf PHP. Wagtail hingegen ist in Python geschrieben und setzt auf das Django Framework. Ein CMS von Entwicklern für Entwickler.

Wagtail wurde im Februar 2014 von der Agentur Torchbox veröffentlicht und in Zusammenarbeit mit dem Royal College of Art für deren neue Website entwickelt [wagtail.io]. Das Content-Management-System hat bis jetzt über 3.500 Sterne auf GitHub. Es gibt bereits tausende Live-Seiten, unter anderem von renommierten Nutzern wie der NASA. Auf madewithwagtail.org finden Sie einige Webseiten, die mit Wagtail umgesetzt wurden.

Wagtail ist ein CMS von Entwicklern für Entwickler. Das heißt in diesem Fall, dass Entwickler es leicht anpassen und erweitern können; gleichzeitig bedeutet das aber auch, dass sie es müssen.

Die überwiegende Mehrheit der Konfiguration findet im Code statt. Das schließt Inhaltstypen mit ein, die Sie zur Eingabe verschiedener Arten von Content verwenden können. Sie können beispielsweise Inhaltstypen für Personen, für Veranstaltungen und für Standorte anlegen. Diesen Inhaltstypen weisen Sie dann Felder zu. Für Personen könnten das Titel, Name, Anschrift und Bild sein. Wenn Sie dann eine neue Person anlegen wollen, sehen Sie auch wirklich nur die Felder, die für die Eingabe relevant sind. Glücklicherweise baut dieses recht neue CMS auf dem etablierten Python-Webframework Django auf. Konfiguration und Erweiterung werden Django-Kennern leicht von der Hand gehen.

Django

Django beschreibt sich selbst als „The Web framework for perfectionists with deadlines”. Es wurde 2005 veröffentlicht und wird unter anderem von Pinterest und Instagram eingesetzt [djangoproject.com]. Viele Dinge, die Sie für eine Webanwendung brauchen, enthält Django bereits: Objektrelationale Abbildung (Object-relational mapper / ORM), URL-Konfiguration, Templating, Views, Models, Authentifizierung, Administration, Datenbankmigrationen, ein Kommandozeilentool und vieles mehr.

Django und Wagtail

Wagtail ist „djangofreundlich”. Bereits vorhandene Django-Apps können leicht in Wagtail integriert werden, und Wagtail-Seiten sind normale Django-Models. Diese einfache Integration unterscheidet Wagtail z.B. von Django CMS. Sowohl Django als auch Wagtail unterstützen Python 3.

Demo-Projekt

Für den einfachen Einstieg in Wagtail gibt es ein Wagtail-Demo-Projekt. Um das Demo-Projekt bei Ihnen lokal zu starten, laden Sie zuerst Vagrant von der Webseite herunter [goo.gl/kMV9yN]. Starten Sie die Installation und folgen Sie den Anweisungen. Danach laden Sie eine Kopie des Demo-Projektes von GitHub herunter [goo.gl/bC3bl1]. Anschließend entpacken Sie die Datei und wechseln auf der Kommandozeile in das entpackte Verzeichnis. Dort geben Sie „vagrant up” ein. Jetzt können Sie sich erst mal einen Kaffee holen, für das Projekt muss einiges heruntergeladen werden. Sobald die Installation abgeschlossen ist, erscheint wieder das normale Kommandozeilenprompt. Ändern Sie jetzt mit dem folgenden Code die Sprache des Demo-Projekts auf deutsch.

# wagtaildemo/settings/base.py, Zeile 40
LANGUAGE_CODE = 'de-DE'

Danach können Sie sich mit dem Befehl „vagrant ssh” in die Virtuelle Maschine einloggen. Nach dem Login geben Sie „./manage.py runserver 0.0.0.0:8000” ein, um den Entwicklungsserver zu starten. Anschließend können Sie das Demo-Projekt in Ihrem Browser über die Adresse http://0.0.0.0:8000/ aufrufen. Unter http://0.0.0.0:8000/admin loggen Sie sich in die Administrationsoberfläche ein. Der Benutzername ist „admin”, das Passwort „changeme”.

Adminoberfläche

Die Adminoberfläche ist sehr aufgeräumt und kommt mit wenigen Menüpunkten aus. Sie können das Aussehen der Oberfläche leicht an Ihre Wünsche anpassen. Nähere Infos finden Sie unter goo.gl/uND4ea. Nach dem Einloggen sehen Sie auf der normalen Seite das Wagtail-Vögelchen. Nach einem Klick darauf können Sie wichtige Funktionen wie z.B. Editieren direkt aufrufen (Abb. 2).

Explorer: Hier können Sie neue Inhalte anlegen, bearbeiten, depublizieren und löschen. Wenn Sie zuerst auf Explorer klicken, fährt nach rechts ein Menülink „Home page” aus. Erst wenn Sie darauf klicken, kommen Sie zur Inhaltsübersicht. Auf Anhieb erscheint das überflüssig. Dieses Verhalten ist aber sinnvoll, wenn Sie mit einer Wagtail-Installation mehrere Websites ausliefern. Die Inhalte werden in einer Baumstruktur abgelegt und jede Website, die Sie in Wagtail angelegen, kann ihren eigenen Baum bekommen oder einen vorhandenen wiederverwenden. Dieser wird auf der gleichen Ebene wie „Home page” angezeigt.

Im Explorer sehen Sie eine Tabelle mit den Inhalten, die unter „Home page” abgelegt wurden (Abb. 3). Dort werden Ihnen die Titel der Inhalte, das Aktualisierungsdatum, der Inhaltstyp und der Veröffentlichungsstatus auf der Ebene direkt unter „Home page” angezeigt. Wenn ein Inhalt mit einem Rechtspfeil markiert ist, hat er Unterseiten. Klicken Sie auf den Pfeil, um zur nächst tieferen Ebene zu gelangen.

Bilder und Dokumente: Diese Punkte dienen zur Verwaltung Ihrer Medien. Sie können hier Bilder und Dokumente hochladen, sie Sammlungen zuweisen, verschlagworten und austauschen.

Snippets: Hier werden Inhalte verwaltet, die Sie auf verschiedenen Seiten wiederverwenden möchten. Das könnten zum Beispiel Werbeanzeigen oder Kontaktdaten sein. Wenn Sie ein „Snippet” hier ändern, wird die Änderung überall dort sichtbar, wo das „Snippet” verknüpft wurde.

Einstellungen: Unter dem Menüpunkt Einstellungen können Sie Nutzer und Gruppen verwalten, Webseiten hinzufügen, Weiterleitungen anlegen und Suchergebnisse hervorheben. Außerdem können Sie Sammlungen anlegen. Diese können Sie verwenden, um Bilder und Dokumente zu kategorisieren. Sie können sie außerdem nutzen, um die Berechtigungen für Ihre Medien feiner zu steuern.

Berechtigungen

Nach der Installation gibt es die Gruppen „Editors” und „Moderators”, die Sie den Benutzer zugeordnen können. Die Berechtigungen sind an die Gruppen geknüpft. Sie können sie editieren, indem Sie auf den Namen einer Gruppe klicken. Ein Benutzer kann mehreren Gruppen angehören und erhält alle Berechtigungen dieser Gruppen. Zusätzlich können Sie Benutzer als Administratoren markieren. Administratoren haben vollen Zugang und dürfen jedes Objekt und jede Einstellung verwalten (Abb. 4).

Objekt-Berechtigungen: Hiermit steuern Sie, ob eine Gruppe bestimmte Objekte im System hinzufügen, editieren und/oder löschen darf. Zu den Objekten gehören unter anderem Gruppen, Benutzer und Weiterleitungen.

Seiten-Berechtigungen: Diese ermöglichen Ihnen, Berechtigungen für Seiten und Unterseiten festzulegen. Sie legen für jede Gruppe fest, ob Inhalte hinzugefügt, bearbeitet, veröffentlicht oder gesperrt werden dürfen. Unterseiten erben die Einstellungen der übergeordneten Seite.

Medienberechtigungen: Sie können Gruppen die Berechtigungen zum Hinzufügen und Bearbeiten der verschiedenen Medientypen geben. Im Demo-Projekt unterscheidet Wagtail zwischen Dokumenten und Bildern. Medien gehören immer einer Sammlung an. Standardmäßig ist das die Sammlung „Root”, Sie können aber unter Einstellungen zusätzliche Sammlungen hinzufügen und für jede einzelne die Berechtigungen festlegen.

Inhaltsverwaltung

In Wagtail stehen Ihnen ein simpler Moderationsworkflow und Revisionen zu Verfügung.

Moderationsworkflow: Dieser wird über die Berechtigungen einer Gruppe gesteuert. Die Gruppe „Editors” darf, bei unveränderten Einstellungen, keine Inhalte veröffentlichen. Im Bearbeiten-Fenster können Nutzer dieser Gruppe nur zwischen „Entwurf speichern” und „Zur Moderation einreichen” wählen. Wenn eine Seite zur Moderation eingereicht wurde, erscheint danach im Bearbeitungsmodus der Hinweis „Diese Seite wartet derzeit auf Freischaltung”. Einem Benutzer, der Inhalte moderieren darf, wird auf der Startseite des Admin-Bereichs eine Übersicht der zu moderierenden Inhalte angezeigt.

Revisionen: Die Revisionsverwaltung ist leider sehr einfach gehalten. Sie können sich zwar einen Überblick über alle gespeicherten Revisionen verschaffen, aber wenn Sie zwei Versionen vergleichen wollen, müssen Sie mühsam versuchen, Unterschiede in der Vorschau zu entdecken. Es fehlt leider die Möglichkeit, sich Differenzen anzeigen lassen zu können.

Private Inhalte: Sie können Inhalte mit einem Passwort schützen. Der Passwortschutz gilt immer auch für alle Unterseiten.

Zeitgesteuerte Veröffentlichungen: Sie können für alle Inhalte festlegen, zu welchem Zeitpunkt sie publiziert bzw. depubliziert werden sollen.

Medienverwaltung

Wagtail bietet eine Verwaltung für Dokumente und Bilder. Sie können Bilder und Dokumente hochladen und Schlagwörter zuweisen, um sie leichter wieder aufzufinden. Nach dem Hochladen müssen Sie ihren Medien einen Titel geben. Hier können Sie die Medien auch Sammlungen zuweisen. Medieninhalte können nachträglich durch andere Inhalte ersetzt werden. Wenn Sie zum Beispiel ein Bild Ihres Firmengebäudes hochgeladen haben und es auf der Webseite an mehreren Stellen verwendet wird, ist es äußerst mühselig diese alle zu finden. Wollen Sie nach einem Umbau Ihres Firmengebäudes ein aktualisiertes Bild einstellen, dann klicken Sie auf das Medienelement, von dem es eine neue Version gibt und laden dann unter „Bild-Datei ändern” bzw. „Dokument ändern” die neue Version der Datei hoch.

Für Bilder gibt es noch ein besonderes Schmankerl: Sie können einen Fokus-Punkt festlegen (Abb. 5). Dadurch bleibt dieser Teil beim automatischen Zuschneiden von Bildern erhalten. Der Nutzer wählt bei der Verwendung von Bildern, abgesehen von der Einbettung in Rich-Text-Felder (siehe unten), keine Bildgröße aus. Diese gibt der Entwickler im Template vor, und das Bild wird dann, unter Berücksichtigung des Fokus-Punkts zugeschnitten und skaliert. Für Rich-Text-Felder können Sie Größen auswählen. Drei sind von Wagtail bereits vordefiniert, aber Sie können weitere hinzufügen [goo.gl/vCVjyh].

Reicht Ihnen das nicht? Vielleicht gefällt Ihnen die Möglichkeit, eine automatische Feature-Erkennung für Bilder durchzuführen. Sie können Wagtail so konfigurieren, dass es mit Hilfe von „Open-CV” (Open source computer vision) automatisch einen Fokus-Punkt festlegt.

Ausgabe von Inhalten

Bei Wagtail entscheiden Sie selbst, wie der Inhalt ausgeben wird. Sie sind weder auf ein bestimmtes Frontend-Framework noch auf bestimmte Javascript-Bibliotheken limitiert. So können Sie das ausgegebene Markup komplett selbst bestimmen.

Wagtail verwendet die „Django template language” (DTL). Benutzer der Template-Engine Twig werden damit keine Schwierigkeiten haben. Die DTL ermöglicht es Ihnen, von anderen Templates zu erben und einzelne Blöcke zu überschreiben. In der Code-Box finden Sie ein Beispiel-Template mit Kontrollstrukturen, Variablen und Filter. Wenn Sie eine Variable ausgeben möchten, schließen Sie sie in geschweifte Klammern „{{ }}” ein. Kontrollstrukturen werden mit „{% %}” gekennzeichnet und Filter mit dem Pipe-Symbol (|).

{# Template für TerminPage #}
{% extends "base.html" %}
{% block content %}
<h1>{{ self.title }}</h1>
<p>
  <em>{{ self.datum }}</em>
  {{ self.beschreibung|safe }}
  <strong>{{ self.ort }}</strong><br>
  {% if self.termin_url %}
  <a href="{{ self.termin_url }}">
    Termin URL
  </a>
  {% endif %}
</p>
{% endblock %}

API: Sie sind bei der Ausgabe von Inhalten aber nicht auf Templates beschränkt. Wagtail integriert das Django REST Framework und ermöglicht Ihnen so, Ihre Inhalte über eine API abzurufen. Was über die API ausgegeben wird, können Sie leicht über die Models Ihrer Seitentypen steuern [goo.gl/2kkWq7]. Eine Besonderheit des Django REST framework ist die „browsable” API. Damit können Sie einen API-Endpunkt aufrufen und sich von

dort zu den Details weiterklicken (Abb. 6). So sehen Sie, welche HTTP-Methoden erlaubt sind und welchen Content-Type die API zurückliefert.

Strukturierung von Inhalten im Code

Pages: Die Basiseinheit Ihrer Inhalte sind Pages (Seiten). Sie können beliebig viele Seitentypen (Inhaltstypen) anlegen, die voneinander erben können und von wagtail.wagtailcore.models.Page (Page) erben müssen. Durch das Erben von „Page” erhält jeder Seitentyp direkt ein paar nützliche Standard-Felder und Einstellungen, wie z.B. Felder für den Titel (den Sie dann etwa als<h1> ausgeben können), den SEO-Titel (für den <title> der Seite), eine SEO-Beschreibung (für das <meta name="description">-Element), das Veröffentlichungsdatum, usw. Nach dem Start eines neuen Wagtail-Projekts gibt es nur den Typ Homepage, der direkt und ohne weitere Anpassungen von wagtail.wagtailcore.models.Page erbt.

# Einfachste mögliche Seite (models.py)
from wagtail.wagtailcore.models import Page
class HomePage(Page):
    pass

Wagtail organisiert Ihre Seiten in einer Baumstruktur. Das bietet Ihnen automatisch einige Vorteile, etwa für die Zugriffsberechtigungen auf die Unterseiten und die Konstruktion der URLs. Trotz der Baumstruktur erlaubt Wagtail ebenso z.B. Übersichtsseiten mit den Anrisstexten eines Seitentyps. Dazu legen Sie eine gewöhnliche Seite in „models.py” an und stellen beispielsweise mit der Funktion „def get_context(self, request)” dem Template jene Inhalte zu Verfügung, die auf der Übersichtsseite ausgegeben werden sollen. Eine mögliche Implementierung finden Sie im Demo-Projekt in der Datei „demo/models.py” in der Klasse „BlogIndexPage”.

Felder: Ein Seitentyp kann verschiedene Felder enthalten, unter anderem alle, die Django bereitstellt. Dazu gehören Felder für Buchstaben, Text, Zahlen, Booleans, Bilder, Dateien, Datum, URLs und viele mehr [goo.gl/ZSGf5g]. Wagtail bringt aber auch eigene Felder mit, wie z.B. das „RichTextField”, das Ihnen einen WYSIWYG-Editor bereitstellt. Standardmäßig wird der Hallo.js-Editor verwendet. Sie können den Editor seitenweit oder für bestimmte Felder durch einen anderen austauschen, und es gibt schon eine Erweiterung, die TinyMCE mit Wagtail integriert [goo.gl/yih26j].

Streamfield: Das Streamfield verleiht Ihnen mehr Flexibilität beim Editieren (Abb. 7). Sie müssen komplexen Inhalt nicht mehr in ein einziges WYSIWYG-Feld eintragen, sondern können nach Bedarf zwischen vordefinierten Inhaltselementen wählen. Diese Inhaltselemente werden bei Wagtail „Block” genannt und können in beliebiger Reihenfolge sortiert werden. Sie bauen Ihre Inhalte so Stück für Stück auf, etwa: Intro, H2, Paragraph, Pullquote, Paragraph etc. Ein Streamfield kann gleichzeitig alles von einem einfachen Text-Block über eine Karte bis hin zu einem konfigurierbarem Bilderkarussell enthalten. Innerhalb der Datenbank wird das Streamfield als JSON abgespeichert und nicht als HTML, damit alle Informationen erhalten bleiben und es auch an anderen Stellen, wie der API, korrekt ausgeliefert werden kann. Auf Youtube finden Sie Demovideo für das Streamfield.

Blöcke: Dies sind die Elemente, die im Streamfield gespeichert werden können. Wagtail bringt zahlreiche Blöcke bereits mit. Dazu gehören einfachere, für Text-, E-Mail-, URL- und Zeitfelder, aber auch komplexere, mit denen Sie Bilder oder Videos einbetten und Verknüpfungen zu internen Seiten anlegen können. Eine Übersicht finden Sie auf goo.gl/tB5VfK. Falls Ihnen ein Block fehlt, können Sie auch eigene erstellen. Nachfolgend finden Sie ein Beispiel für einen Code-Block, der aus einem Textfeld für den Code und einem Feld für die Auswahl der Programmiersprache (hier Python oder Bash/Shell) besteht.

# Code-Block (models.py)
class CodeBlock(blocks.StructBlock):
    LANGUAGES = (
        ('python', 'Python'),
        ('bash', 'Bash/Shell'),
    )

    code = blocks.TextBlock(max_length=8000, blank=False, null=False)
    language = blocks.ChoiceBlock(choices=LANGUAGES, blank=False, null=False, default='python')

Erweiterungen

Sie können mit Wagtail jede Django-Erweiterung benutzen, sofern sie dem CMS nicht in die Quere kommt. Eine Übersicht finden Sie unter djangopackages.org. Es gibt aber auch Erweiterungen, die speziell für Wagtail gedacht sind. Eine entsprechende Liste bietet das „Awesome Wagtail”-Repository auf GitHub [goo.gl/PSD7qA]. Hier ein Auswahl von Wagtail-spezifischen Erweiterungen:

Wagtail Bakery: Beispielhafte Implementierung zur Erzeugung statischer Seiten. Je nach Konfiguration können Sie die erzeugten statischen Seiten auch automatisch veröffentlichen [goo.gl/RkCUCu].
Wagtail Yubikey: Stellt eine Zwei-Faktor-Authorisierung für Ihre Website mittels eines Yubikeys zu Verfügung [goo.gl/CplsZJ].
Wagtail Media: Erweitert die Medienverwaltung um Videos und Audiodateien. Sie können das verwendete „Media model” an Ihre Bedürfnisse anpassen. Zusätzlich wird noch ein Media-Feld bereitgestellt, das Sie in Ihren Inhaltstypen verwenden können [goo.gl/JZ2wwp].
Wagtail Embed Videos: Ermöglicht Ihnen, YouTube- und Vimeo-Videos sowie Musik von Soundcloud in Ihre Inhalte einzubetten [goo.gl/ZM9w7u].
Wagtail Analytics: Fügt der Adminoberfläche den Menüpunkt Analytics hinzu und zeigt darunter die Google-Analytics-Daten für Ihre Webseite. Bei Seiten können Sie im Editier-Modus mit einem Klick auf Einstellungen sehen, wie oft sie aufgerufen wurde [goo.gl/AeXPSe].

Fazit

Wagtail ist ein CMS, das Ihnen nicht im Weg steht, wenn sich Ihre Anforderungen ändern. Bei Anpassungswünschen können Sie jederzeit auf Django zurückgreifen. Die nahtlose Integration des Django REST Frameworks hilft Ihnen dabei, Inhalte in der gewünschten Form an die gewünschten Stellen auszuliefern. Sie können die Admin-Oberfläche bequem an Ihr Branding anpassen. Auch die Redakteure werden Ihnen für die klare Oberfläche zur Texteingabe danken. Sie bekommen hier also alles mitgeliefert, was Sie für ein funktionales, modernes CMS benötigen.

Andererseits gilt aber auch: Falls Sie über keine Programmierkenntnisse verfügen und auch keinen Zugriff auf Webentwickler haben, ist Wagtail nichts für Sie. Wagtail wird auf Code-Ebene erweitert und konfiguriert. Es gibt noch ziemlich wenige Erweiterungen und keine zentrale Stelle, an der diese gelistet sind. Aus den „READMEs” der Erweiterungen geht nicht immer klar hervor, welche Installationsschritte nötig sind und für welche Version sie geeignet sind. Durch die freie Wahl beim Frontend und die leichte Erweiterbarkeit, die sicher auch eine Ursache für die geringe Zahl der Erweiterungen ist, eignet es sich dennoch gut für anspruchsvolle Projekte.

Dieser Artikel erschien zuerst in der Screenguide - Ausgabe 32