Einleitung

Bei dem Begriff Content Management System (abgekürzt CMS) denken Viele an gängige Systeme wie Drupal, Joomla, Typo3 oder Wordpress. Diese Systeme haben alle eines gemeinsam: sie benötigen für den Betrieb eine Datenbank. Das ermöglicht zwar Inhalte dynamisch zu generieren und bietet Raum für vielfältige Anwendungen. Aber es gibt auch Schattenseiten: Das Einbinden einer Datenbank öffnet potenziell zusätzliche Sicherheitslücken, erfordert mehr Rechenleistung vom Webserver und ist auf Billigst-Webspace nicht verfügbar. Kirby zeigt, dass es auch anders geht. Ganz ohne Datenbank kann man trotzdem ansprechende Webseiten erstellen, die darüber hinaus sehr performant sind. In diesem Artikel wollen wir zeigen, wie es geht und was man beachten muss. Kirby ist im Gegensatz zu den oben genannten CMS nicht kostenlos. Allerdings ist die Lizenzgebühr sehr preiswert und beträgt einmalig 15 € für eine private, bzw. 79 € für eine Firmenwebseite (jeweils zuzüglich MwSt.). Einen weiteren potenziellen Nachteil wollen wir auch gleich erwähnen: Die gesamte Kirby-Dokumentation ist in Englisch.

Was ist Kirby?

Kirby ist ein Content Management System, das ohne eine Datenbank auskommt (Flat File CMS). Alle Inhalte (zum Beispiel Blogposts oder statische Seiten) werden in normalen Textdateien gespeichert und können sowohl online über das Kirby-Backend (das “Panel”) als auch offline mit einem normalen Texteditor bearbeitet werden. Diese Dateien folgen einer bestimmten Namenskonvention und werden in einer speziellen Ordnerstruktur abgelegt. Diese Ordnerstruktur legt die Struktur der Webseite fest und sorgt dafür, dass das Ganze auch dann noch übersichtlich bleibt, wenn man mehr als nur eine Handvoll Inhalte verwalten muss.

Die Auszeichnung der Inhalte erfolgt mittels „Markdown“. Markdown ist eine vereinfachte Auszeichnungssprache, die es seit 2004 gibt. Ihr Vorteil ist, dass schon der Ausgangstext ohne weitere Konvertierung recht leicht lesbar ist, da sie vor allem Auszeichnungsarten verwendet, die auch in Plain text oder E-Mails üblich sind.

Kirby bietet auch einen recht einfachen Weg an, um eine mehrsprachige Webseite zu erstellen. Die Verwaltung der übersetzten Inhalte ist allerdings nicht allzu komfortabel, da sie nur über die Ordnerstruktur umgesetzt wird. Komfortfunktionen wie bei Drupal, wo man leicht sieht, welche Inhalte noch übersetzt werden müssen oder Übersetzungen als veraltet markieren kann, gibt es hier nicht. Man muss also selber dafür sorgen, dass man den Überblick darüber behält, was noch fehlt oder aktualisiert werden muss.

Installation

Die Installation von Kirby gestaltet sich ausgesprochen einfach. Man lädt das aktuelle Kirby-Paket von der Kirby-Webseite herunter und entpackt es. Anschließend lädt man alles per FTP auf seinen Webspace. Das funktioniert selbst mit dem billigsten Webspace, den man zu kaufen kriegt - sofern er über eine aktuelle PHP-Version verfügt.

Technische Voraussetzungen für eine Kirby-Installation:

• Webserver Apache 2 mit aktiviertem mod_rewrite-Modul oder der alternative Webserver nginx
• 5 - 10 MB Speicherplatz je nach Paket (mehr ist natürlich besser, vor allem wenn man viele Bilder benutzt)
• PHP 5.6 (besser 7.1 oder neuer)
• PHP mbstring-Erweiterung für UTF-8 Unterstützung

Ist alles auf den eigenen Webspace geladen, kann man seine frische Kirby-Installation auch schon im Webbrowser aufrufen. Wir nehmen im Folgenden an, dass unsere Domain example.edu heißt. Natürlich kann man Kirby auch in eine Subdomain packen und so mit einer Hauptdomain verschiedene Kirby-Installationen bereitstellen.

Aufbau einer Kirby-Webseite

Schauen wir uns jetzt zunächst einmal die Kirby-Seite auf dem Server an.

Die Standardinstallation von Kirby ist mit Beispielseiten und Musterinhalten befüllt, anhand derer man sich mit der Funktionsweise von Kirby vertraut machen kann. An dieser Stelle sei gesagt, dass es schwer ist, ohne Grundkenntnisse in HTML und ein Grundverständnis für PHP eine Seite mit Kirby zu realisieren. Unter https://www.getkirby-themes.com/ findet man eine Reihe kostenloser und kostenpflichtiger Kirby-Templates, die zum Teil mit der Kirby-Standardinstallation schon funktionieren, zum Teil mit Funktionserweiterungen aufwarten und als Gesamtpaket Kirby-Template-Plugins-Beispielinhalte heruntergeladen werden können. Wenn man schon eine bestimmte Vorstellung davon hat, wie die fertige Seite aussehen und strukturiert sein soll, ist ein Blick in diese fertigen Pakete lohnenswert - vielleicht findet sich hier schon eine Lösung, die man ohne viel Aufwand übernehmen kann. Aber zuerst schauen wir uns an, was die Kirby-Standardseite zu bieten hat.

Leichter Start: Kirby Starterkit

Neben der Startseite, die aus zwei (eigentlich sogar drei) Abschnitten besteht, gibt es noch vier Menüpunkte, die jeweils beispielhaft die Funktionsvielfalt von Kirby wiederspiegeln. Schauen wir uns zunächst die Startseite an. Sie heißt “Home” und zeigt zwei Textabschnitte und darunter noch eine Art Bildergalerie, die aus den neuesten Projekten (latest projects) gespeist wird. Klicken wir darunter auf den Link, der zu allen Projekten führt, kommen wir auf die Seite, die unter dem ersten Menüpunkt “Projects” angelegt ist. Hier sind neben den drei Beispielen von der Startseite noch zwei weitere Projekte aufgeführt.

Die Seite “Blog” zeigt einen kurzen Einführungstext und darunter eine Reihe blogtypischer Anrisstexte mit Weiterlesen-Link, der jeweils auf die Vollansicht der Artikel verlinkt.

Die Seite “About” erinnert an die Startseite: Zwei kurze Textabschnitte werden gefolgt von mehrspaltigem Inhalt, diesmal jeweils mit Bild und Text.

Die “Contact”-Seite treibt das Ganze noch einmal auf die Spitze und ist in drei Abschnitte mit unterschiedlichen Inhalten eingeteilt.

Kirby-Backend - ein Blick hinter die Kulissen

Wie stellen sich diese Abschnitte jetzt im Backend da? Um es aufzurufen, fügen wir im Browser der Adresse unserer Startseite, beispielhaft http://meinkirby.de/ das Wort “panel” an, also http://meinkirby.de/panel/ (der letzte Querstrich wird beim Seitenaufruf automatisch zugefügt). Wenn wir das Panel zum ersten Mal aufrufen, müssen wir hier einen Benutzernamen, ein Passwort, die Benutzer-E-Mailadresse und die Benutzersprache angeben. Die Sprachauswahl bezieht sich dabei nur auf das Backend, nicht darauf, in welcher Sprache die Webseite angezeigt wird!

Die Übersichtsseite zeigt uns schon die Seitenstruktur an und einige Informationen zur Seite und dem angemeldeten Benutzer.

Unter dem Hamburgermenü links oben verbergen sich neben den Benutzereinstellungen seitenweite Einstellungen, die unter anderem wichtig sind für Suchmaschinen, nämlich der Seitentitel, der Autor und die Beschreibung. So etwas wird gerne vergessen, ist aber durchaus wichtig, denn Titel und Beschreibung werden später bei Google in den Suchergebnissen erscheinen und sollten sorgfältig angepasst werden. Der Titel wird außerdem in den meisten Templates im Seitenkopf ausgegeben (in diesem Fall “Kirby Starterkit”) und muss deshalb auf jeden Fall angepasst werden. Hier findet sich außerdem ein Feld für die Angaben im Seitenfuß. Je nach Template können in den Einstellungen noch weitere Eingabefelder vorhanden sein, z.B. für Social Media Links. Behalten wir dieses Menü also immer im Kopf, wenn wir einen Inhaltsbereich suchen und in der Panel-Übersicht partout nicht finden können.

Zurück zur Übersicht: Wir sehen die Auflistung der Seiten, teils mit, teils ohne Nummerierung. Die Nummer gibt an, ob ein Inhalt veröffentlicht ist oder nicht. Im Fall dieser oberen Struktur erscheinen nur Seiten mit Nummern auch im Menü. Die Seiten “Home” und “Error” werden nicht über das Menü aufgerufen, sondern nur durch Verlinkung. Im Fall der Startseite führt uns nur ein Klick auf den Seitennamen “Kirby Starterkit” wieder dort hin

Die Startseite

Schauen wir uns die Startseite doch jetzt von “innen” an: Ein Klick auf “Home” führt uns jetzt eine Ebene weiter und offenbart folgenden Einblick.

Wir sehen einen Titel, eine Intro und einen Text, was wir auch jeweils auf der Startseite wiederfinden. Was wir nicht finden ist der Abschnitt mit den Projekten, der auf der Startseite unter dem Text dargestellt wird. Seitenkopf mit dem Logo und dem Menü und Seitenfuß mit dem Copyright-Vermerk werden ebenfalls nicht an dieser Stelle befüllt. Wie wir an diese Inhalte kommen, wird in den nächsten Abschnitten beschrieben.

Die Projekte

Springen wir jetzt einmal zu den Projekten, können wir sehen, wie die Struktur sich noch weiter in die Tiefe gliedert.

Der Projects-Seite ordnen sich fünf Seiten unter und wenn man eine dieser Seiten anklickt, findet man hier weitere spezielle Eingabefelder.

Welche Felder mit welcher Bezeichnung jeweils verwendet werden, wird in den Blueprints definiert. Dabei kann man beliebig viele Felder mit unterschiedlichen Eingabewerten anlegen, unter anderem außer Text auch Bilder, Dateien, Webseiten-Links oder E-Mailadressen, außerdem kann man Formulare mit Auswahlfeldern definieren und vieles mehr. Ein schönes Beispiel ist hier eine der Unterseiten aus dem Menüpunkt “About”.

Noch mehr Seiten

Die anderen Seiten und Unterseiten sind nach ähnlichen Mustern aufgebaut und insofern interessant, als sie für die eigene Webseite als Vorlagen dienen können. Die Verknüpfung aus Blueprints, Templates, Snippets und eventuell dazugehörigen Skripten erscheint im ersten Moment verwirrend, ist aber streng logisch und macht auch einen Teil des Zaubers von Flat File CMSen aus.

 

Soviel für heute. Im Teil 2 befassen wir uns dann intensiver mit dem Aufbau einer Kirby-Seite und schauen uns Templates, Snippets, Blueprints und Assets an.