WordPress als Content-Management-System Teil 1

Es muss schon etwas dran sein an diesem Content-Management-System, wenn selbst das Weiße Haus (whitehouse.gov) oder große Firmen wie Disney (thewaltdisneycompany.com) darauf setzen. Ursprünglich als Blog-System konzipiert, hat sich WordPress in den letzten 15 Jahren zu einem echten Alleskönner gemausert. Durch unzählige Erweiterungen sind schon mit geringem Aufwand individuellste Website-Lösungen möglich. Von einfacher Seitenverwaltung über Paid-Content-Bereiche oder Online-Shops bis hin zur komplexen Benutzerverwaltung bietet WordPress selbst oder durch Erweiterungen ein vielfältiges Portfolio an. WordPress ist dabei kostenlos, einfach zu bedienen und außerordentlich flexibel. Beginnend mit diesem Artikel starten wir eine kleine Serie für Sie rund um das beliebte CMS. Wie funktioniert es? Welche Herausforderungen gibt es und wie kann man sich dabei behelfen? Und was sind wichtige Kniffe, die es zu beachten gilt? Zum ersten Kennenlernen zeigt Ihnen Phillip Groschup in Teil 1 die richtige Installation von WordPress, die Auswahl des Layouts und das System zur Verwaltung von Inhalten.

WordPress ist inzwischen das beliebteste Content-Management-System (CMS) zum Betreiben einer Website. Nach Untersuchungen von w3techs.com hat WordPress gegenüber anderen Systemen mit 62 % einen außerordentlich hohen Marktanteil. Rund 35 % der 10 Millionen meistbesuchten Seiten im Internet wurden mit WordPress erstellt (Abb. 1). Dieser hohe Anteil ist nicht unbegründet. Nach 15 Jahren kontinuierlicher Entwicklung hat sich WordPress zum multifunktionalen System entwickelt. Auch komplexere Anwendungen sind dank einer Vielzahl von Erweiterungen oder individueller Anpassungen möglich. Das System ist grundsätzlich kostenlos, leicht zu installieren und leicht verständlich. Dank seines „Low-Code”-Ansatzes sind Programmierkenntnisse für den Betreiber der Website in der Regel gar nicht oder nur in geringer Form notwendig. Schon mit wenigen Klicks können erste Seiten erstellt werden. 

Matthew Mullenweg war es, der 2003 zusammen mit Mike Little begann, aus dem damals bereits bestehenden Webblogsystem b2/cafelog WordPress zu entwickeln. WordPress wurde von Anfang an als kostenloses Open-Source-System konzipiert. Mit seiner Firma „Automattic” entwickelten Mullenweg und sein Team den Dienst wordpress.com und das WordPress Anti-Spam-Plug-in „Akismet”. Zudem gründete er die WordPress Foundation – eine gemeinnützige Organisation, welche die Marke WordPress verwaltet und die Arbeit am WordPress-Projekt unterstützt.

wordpress.com & wordpress.org

Wer nach „WordPress” googelt, der findet sowohl unter wordpress.com als auch unter wordpress.org eine Website zum Thema WordPress. Analog zur ursprünglichen Bedeutung dieser Domainendungen (.com für Unternehmen und kommerzielle Anbieter, .org für nicht kommerzielle Anbieter) sind auch diese verschiedenen WordPress-Varianten zu verstehen.

wordpress.com

Die .com-Variante ist ein von Automattic bereitgestellter Dienst. Hier wird die Software von WordPress als Dienstleistung bereitgestellt. Für die initiale Einrichtung fällt lediglich eine Online-Registrierung an. Die WordPress-Website wird als Subdomain von wordpress.com gebucht. Gegen Aufpreis kann die WordPress-Seite auch unter einer Hauptdomain betrieben werden (Abb. 2). WordPress ist hier in seinen Funktionen allerdings eingeschränkt. Nur bestimmte Erweiterungen lassen sich aktivieren. Zudem können Layout-Anpassungen nur eingeschränkt und nach den vom Betreiber festgelegten Vorgaben definiert werden.

wordpress.org

Auf der Seite de.wordpress.org/download/ (Abb. 3) lässt sich WordPress mit deutschsprachigen Grundeinstellungen als Software herunterladen. Dabei werden alle nötigen Dateien geliefert, die für das Betreiben auf einem Webserver vonnöten sind. Gegenüber der wordpress.com-Variante muss man sich hierbei selbst um Webserver und Installation kümmern. Der Aufwand lohnt sich aber, da nach den initialen Aufwänden die gesamten WordPress-Funktionalitäten zur Verfügung stehen.

 

WordPress installieren

Bei der .com-Variante bietet wordpress.com eine einfache Registrierungsroutine, die es zu befolgen gilt. Bereits nach wenigen Klicks ist die eigene, ganz persönliche Website aktiviert. Bei der Variante von wordpress.org sollte man sich vor der eigentlichen Installation Gedanken über die Entwicklungsumgebung machen. Wer die neue Website nicht direkt in das Internet stellen möchte, der kann Tools wie „Xampp” oder „MAMP” nutzen. Diese simulieren einen Webserver auf dem lokalen Rechner und führen die WordPress-Website zuerst lokal aus. Ist die lokal entwickelte Website fertiggestellt, ist ein Umzug der Website auf den Live-Server nötig. Eine Entwicklungsumgebung direkt auf dem zukünftigen Webserver einzurichten, kann jedoch vorteilhaft sein. Konfigurationen von Webservern sind oft unterschiedlich und bei einem Umzug der Website kann es dadurch hin und wieder zu nachträglichen Problemen kommen. Wenn eine Website also komplett neu erstellt wird, dann empfiehlt sich die Entwicklung direkt auf dem Webserver sowie unter Verwendung der neuen Domain. Falls es sich um eine bestehende Website handelt, die neu gestartet wird (Relaunch), kann die neue Website auch vorerst unter einer Subdomain entwickelt werden. Für den Umzug von Subdomain auf Hauptdomain muss dann lediglich die URL der WordPress-Website geändert werden. Bei der Entwicklung auf einem Online-System gibt es allerdings einige Fallstricke zu beachten. Stets sollte dafür gesorgt werden, dass nur berechtigte Personen oder Systeme Zugriff auf die Entwicklungsumgebung bekommen. Eine vorzeitige Indexierung durch Google ist i. d. R wenig wünschenswert. Zudem ist sicherzustellen, dass andere Websites auf dem Webserver aufgrund etwaiger Programmierfehler nicht in Mitleidenschaft gezogen werden. WordPress nennt als offizielle Anforderungen die PHP-Version 7.3 oder höher, eine MySQL-Datenbank (5.6 oder höher) oder MariaDB-Datenbank (10.1 oder höher) sowie HTTPS-Unterstützung. Bei der Wahl eines entsprechenden Webhosters (Anbieter, der Server im Internet betreibt) sollte dies berücksichtigt werden. Auch wenn WordPress mit niedrigeren Versionen funktionstüchtig ist, so entstehen unnötige Sicherheitslücken, die es zu vermeiden gilt. Es gibt übrigens auch auf WordPress spezialisierte Webhoster. Diese bieten oft innerhalb ihres Services einfache Ein-Klick-Installationen von WordPress an.

Hinweis

Eine WordPress-Website ist als .com- oder als .org-Variante nutzbar. Da die .com-Variante von ihren Funktionen eingeschränkt ist und von einem Dienstleister betrieben wird, wird in dieser Artikel-Reihe stets von der .org Variante ausgegangen, es sei denn, es wird explizit von .com gesprochen.

1. Fileupload mit FileZilla

Wurde ein Paket bei einem Webhoster gebucht, liefert dieser entsprechende Zugangsdaten zum Verwalten des Webhosting-Pakets. Mit den darin enthaltenen FTP-Zugangsdaten kann von extern auf den Webserver zugegriffen werden. Diese Zugangsdaten bestehen aus Host (Name bzw. IP-Adresse), Benutzernamen und einem Passwort. Ein bekanntes und kostenloses Tool zum Verwalten der entfernten Dateien ist „FileZilla”. Bei erfolgreichem FTP-Log-in zeigt FileZilla auf der rechten Seite die Dateistruktur des Webservers, auf der linken Seite die Dateistruktur des lokalen Rechners (Abb. 4). Einfach per Drag & Drop lassen sich die Dateien von WordPress auf den entfernten Webserver schieben. Im unteren Bereich lassen sich die offenen und erfolgten Dateiübertragungen beobachten. Die Verbindung zum Server sollte übrigens nicht über eine einfache FTP-Verbindung, sondern über eine SFTP-Verbindung erfolgen. Nur hierbei werden die Daten verschlüsselt übertragen.

2. Domain einrichten

Die meisten Webhosting-Pakete beinhalten eine Inklusiv-Domain. Ist dies nicht der Fall, so bietet der Webhoster in der Regel die Möglichkeit zur Buchung einer Domain an. Die Konfiguration der Domain funktioniert je nach Hosting-Anbieter unterschiedlich. Der Regelfall ist, dass es im Administrationsbereich des Webhosters einen Bereich zur Domainverwaltung gibt. Dort lässt sich einstellen, auf welches Webserver-Verzeichnis die Domain zeigt. Hier ist das Verzeichnis auszuwählen, in welchem sich die WordPress-Dateien befinden. Bei Aufruf der Domain wird der Besucher auf das entsprechende Verzeichnis geleitet. Bei Problemen in der Konfiguration hilft auch der Webhoster weiter.

3. Datenbankverbindung herstellen

Wird die gewählte Domain aufgerufen und wurde bis hier alles korrekt vorbereitet, wird die Installationsroutine von WordPress angezeigt. Innerhalb der ersten Schritte werden die Verbindungsdaten zur Datenbank angefordert. (Abb. 5). WordPress ist ein datenbankgestütztes System. Das bedeutet, Programmcode und Inhalte werden (bestenfalls) strikt voneinander getrennt. Bei diesem Schritt wird der Programmcode initial mit der Datenbank verknüpft. Die Zugangsdaten zur Datenbank werden ebenfalls durch den Webhoster ausgehändigt. Der „Datenbank-Host” ist in der Regel „localhost”. Das vordefinierte Präfix „wp_“ sollte individuell geändert werden. Nutzen mehrere WordPress-Websites die gleiche Datenbank, lässt sich anhand des Präfixes feststellen, welche Datenbank-Tabelle zu welcher Website gehört. Im weiteren Verlauf der Installation sind noch Titel der Website und ein Benutzerzugang festzulegen.

Erste Schritte im WordPress-System

Nach dem initialen Set-up und der darauffolgenden Anmeldung geleitet WordPress schließlich in das Backend, die Kommandozentrale der Seite. Eingeloggt wird sich später immer über die Adresse {domain}/wp-admin/.Die erste sichtbare Seite ist das WordPress-Dashboard (Abb. 6). Hier gibt es Hinweise, was zu tun ist, wie z. B. das Erstellen von Seiten oder das Anpassen der Menüstruktur. Im unteren Bereich werden zudem einige Boxen mit Informationen zur Website gezeigt. Hier lassen sich durch Erweiterungen später auch noch individuelle Informationen wie etwa Google-Analytics- Daten anzeigen. 

Auswahl eines Themes

Themes legen das Aussehen der Website und das zur Verfügung stehende Tool-Set fest. Bevor es an die Erstellung von Inhalten geht, empfiehlt es sich, infrage kommende Themes zu testen. Je nach Anforderungen ist dabei auf das Layout und die Anpassbarkeit zu achten. Eine große Sammlung Themes bietet wordpress.org direkt selbst an, auf dessen Theme-Verzeichnis direkt über das WordPress-Backend zugegriffen werden kann. Über den Menüpunkt Design > Themes werden die aktuell verfügbaren Themes der WordPress-Website gezeigt. Durch Klick auf den Button „Hinzufügen” lassen sich diese aus dem offiziellen WordPress-Verzeichnis (wordpress.org/themes) auswählen und installieren (Abb. 7). Diese kostenlosen Themes sind oft schlicht, dadurch aber mit schlankem Code versehen und oft performanter. Bemerkenswert ist auch der Sicherheitsaspekt. Da jedes der Themes auf wordpress.org einen internen Prüfungsprozess von erfahrenen WordPress-Entwicklern durchläuft, sind diese für Sicherheitslücken deutlich weniger anfällig. Je nach Theme gibt es unterschiedliche Einstellungsmöglichkeiten. Viele bieten beispielsweise von Haus aus die Möglichkeit, Schriftarten oder Farben zu ändern. Für einfache Blogs, einige Unternehmensseiten oder Online-Visitenkarten ist dies völlig ausreichend. Soll das Layout einer Website sehr individuell gestaltet werden, so empfehlen sich „simple“ Themes aus dem Theme-Verzeichnis. Diese bieten grundlegende Theme-Dateien und können durch einen WordPress-Entwickler nach Belieben auf die individuellen Bedürfnisse zugeschnitten und erweitert werden. Weitere Quellen für Themes sind Anbieter sogenannter „Premium-Themes”. In den letzten Jahren haben sich unabhängige Entwicklerstudios vermehrt darauf spezialisiert kostenpflichtige WordPress-Themes zu programmieren. Beliebte Premium-Themes sind z. B. „Betheme”, „Avada“ oder „Jupiter X“, die für 40 € bis 100 € auf Marktplätzen wie themeforest.net vertrieben werden. Es gibt auch Entwicklerstudios, die auf eigenen Plattformen Premium-Themes anbieten, wie z. B. Elegant Themes mit „Divi", oder Elmastudio mit ihren sehr individuellen Themes. Im Vergleich zu Themes aus dem WordPress-Verzeichnis haben Premium-Themes oft deutlich mehr Einstellungsmöglichkeiten. Damit lassen sich Websites auch ohne Programmierkenntnisse höchst individuell und flexibel gestalten. So sind neben den üblichen Farbeinstellungen oft auch verschiedene Darstellungsformen für Header, Footer oder Inhaltsdarstellung in verschiedensten Varianten auswählbar. Premium-Themes verwenden jedoch häufig eigenständige Pagebuilder-Systeme. Das sind Anwendungen, die den regulären WordPress-Editor ersetzen und durch ein eigenes System die Inhalte der Website anordnen lassen. Damit lassen sich Strukturen und Inhalte relativ einfach zusammenklicken. Mit der „Einfachheit” wird aber auch ein Abhängigkeitsverhältnis erkauft, da der erzeugte Code, der hinter einem Pagebuilder-System steht, nicht für andere Themes nutzbar ist. Das macht den Wechsel eines Themes im Nachhinein deutlich aufwendiger.

Inhalte ganz individuell strukturieren

Bei der Erstellung von Inhalten bietet WordPress zwei Seitentypen an – Beiträge und Seiten. Diese funktionieren technisch gesehen identisch. Da WordPress jedoch ursprünglich als Blog-System konzipiert wurde, sind „Beiträge” als die Artikel des Blogs und Seiten als „statische Seiten” wie etwa eine Impressum-, Über-uns- oder andere Inhaltsseiten zu verstehen. Wer für seine Website ein Blog oder ein Newsportal mit kontinuierlich neuen Artikeln vorsieht, der sollte seine Artikel im Bereich „Beiträge” veröffentlichen. Das ist zwar nicht zwingend notwendig, meist aber im Zusammenhang mit der Ausgabe durch das Theme im Frontend vorteilhafter. Bei beiden Seitentypen wird ab der WordPress-Version 5 ein neuer Editor gezeigt, welcher unter dem Namen „Gutenberg” entwickelt wurde. Dieser ersetzt seit WordPress-Version 5, welche am 6. Dezember 2018 veröffentlicht wurde, den alten TinyMCE Editor und fährt mit dem Ansatz, jeden Inhaltsteil in „Blöcke” zu unterteilen, eine komplett neue Methode. Die Änderungen, die mit diesem neuen Editor kamen, sind umfangreich und werden zudem kontrovers diskutiert. Daher widmet sich diese Artikel-Reihe dem neuen Editor mit einem eigenständigen Artikel in der nächsten Ausgabe der Website Boosting. Wer sich den neuen Editor jedoch jetzt schon ansehen möchte, der findet unter de.wordpress.org/gutenberg/ eine erste Einführung. 

Zusätzlich zu den genannten Seitentypen lassen sich benutzerdefinierte Seitentypen (Custom Post Types) anlegen. Diese werden programmatisch oder mit einer WordPress-Erweiterung hinzugefügt. Spezielle Seiten eines bestimmten Typs lassen sich damit einem eigenen Bereich zuordnen und verwalten. Ein Beispiel: Eine Website rund um das Thema „Filme“ soll für jeden Film eine eigene Unterseite anbieten. Dafür wird der benutzerdefinierte Seitentyp „Filme” angelegt, wodurch im WordPress-Backend ein eigener Bereich zur Verwaltung aller Filme entsteht. Alle Filmseiten erscheinen dann in einem speziell für Filme angelegten Layout und mit ihren speziellen Metadaten. Das sorgt für Ordnung im WordPress-System. Neben ihrem Seitentyp lassen sich Inhalte wie Filme zudem in Taxonomien klassifizieren. WordPress-Beiträge sind beim initialen Set-up bereits mit den Taxonomien „Kategorie” und „Schlagwort” ausgerüstet. Ihnen lassen sich dann Begriffe (intern als Term bezeichnet) zuordnen, für die im Frontend eine Übersichtsseite (intern als Archive bezeichnet) erstellt wird. Auch benutzerdefinierte Taxonomien (Custom Taxonomies) lassen sich festlegen. So ist z. B. für den Seitentyp „Filme“ die Taxonomie „Regisseur“ und „Darsteller” definierbar (Abb. 8). Wird eine neue Seite für einen Film erstellt, kann dieser Regisseuren bzw. Darstellern zugeordnet werden. Durch die Archiv-Seiten werden von WordPress ganz automatisch Übersichtsseiten erstellt, auf denen alle Filme gelistet werden, an denen ein Regisseur bzw. Darsteller mitgewirkt hat.

Zuletzt lassen sich jedem Inhalt noch sogenannte benutzerdefinierte Felder (Custom Fields) zuweisen. Benutzerdefinierte Felder sind Key-Value-Paare und erweitern Inhaltsseiten um individuelle Metadaten, wie zum Beispiel das „Erscheinungsjahr“. Durch WordPress-Erweiterungen wie „Advanced Custom Fields” lassen sich damit ganz individuelle Eingabemasken erstellen (Abb. 9). Die Daten aus den benutzerdefinierten Feldern lassen sich dann an der gewünschten Stelle auf der Filmseite ausgeben oder für selbst programmierte Einstellungsmöglichkeiten verwenden. Durch die kombinierte Verwendung von benutzerdefinierten Seitentypen, benutzerdefinierten Taxonomien und benutzerdefinierten Feldern lassen sich bei richtiger Anwendung auch komplexe Systeme wie etwa eine „Facetted Search“ erstellen. Dabei werden die Klassifikationen der Inhalte als Filter eingesetzt. Über Dropdowns, Schieberegler oder Auswahlfelder können so die passenden Inhalte eingegrenzt werden. Auf der Website zylinderkonfigurator.wagner-sicherheit.de ist eine derartige Facetted Search, die mit WordPress umgesetzt wurde, zu sehen. Hier wurden Türzylinder mit ihren Metadaten ausgestattet. Über verschiedene Dropdowns kann der Benutzer bestimmte und ihm wichtige Merkmale auswählen (Abb. 10). Das System filtert bei jeder Änderung durch den Benutzer die infrage kommenden Türzylinder.

Fazit

Die hohe Benutzerfreundlichkeit und Flexibilität hat WordPress zu dem gemacht, was es heute es ist: das beliebteste Content-Management-System im Internet. WordPress lässt sich bereits mit geringer Konfiguration als Blog oder einfache Website betreiben. Sind die Ansprüche höher, lassen sich mit Premium-Themes ansprechende Websites fast ohne Programmierkenntnisse erstellen. Für speziellere Anforderungen lassen sich ganz individuelle Anpassungen vornehmen, die sich auf ein äußerst flexibles System aus benutzerdefinierten Seitentypen, benutzerdefinierten Taxonomien und benutzerdefinierten Feldern stützen. WordPress bietet zudem ein riesiges Portfolio an Plug-in-Erweiterungen, die viele bekannte Anwendungsfälle abdecken (diese Artikel-Reihe wird darauf noch näher eingehen). Damit lassen sich auch Community-Plattformen, Paid-Content-Bereiche oder Shopsysteme realisieren. Zuletzt verfügt WordPress über eine riesige Open-Source-Community – Menschen, die das System selbst und seine Erweiterungen stetig weiterentwickeln.