Webentwicklung mit WordPress

Wer sich als WordPress-Entwickler, Designer, Web-Consultant oder Programmierer behaupten will, der sollte sich ein breit gefächertes Wissen und möglichst viele Fähigkeiten aneignen. Die meisten Kunden haben weder die Zeit noch das Interesse, um sich mit technischen Aspekten zu beschäftigen. Sie wünschen sich einen vollständig einsatzbereiten Online-Auftritt, in den sie nur noch ihre Inhalte eintragen müssen. Die Website soll Suchmaschinen-optimiert sein und gegebenenfalls zusätzliche Einnahmen durch Werbung einspielen.

Dadurch hat der heutige Spezialist vielfältige Aufgaben. Seine Kompetenzen reichen von der Erstellung einfacher Webseiten über die Theme- und Plugin-Programmierung bis zum Aufbau professioneller Webauftritte. Hinzu kommen Server-Absicherung und Datenbank-Entwicklung, sowie Beratung im Bereich SEO und Online-Marketing.

PHP & WordPress Basics

Jeder Designer, Consultant und Entwickler benötigt ein gutes Verständnis vom Zusammenspiel der drei zentralen Komponenten Datenbank, PHP-Programm und Themes. Er muss die grundlegenden Fähigkeiten besitzen, um HTML- und CSS-Code zu bearbeiten sowie PHP-Programme und SQL-Abfragen zu schreiben. Dabei spielt es keine Rolle, ob Sie als Freelancer oder in einer Design-Agentur arbeiten wollen. Des Weiteren benötigt der Experte Kenntnisse in der Datenbank-Entwicklung, der Domain-Registrierung und zumindest ein Grundwissen zur Webserver-Installation.

PHP7

PHP ist die Programmiersprache, in der sowohl das Open-Source-CMS selbst als auch die Templates und Plugins geschrieben sind. Durch den offenen Quellcode lässt sich die Webanwendung beliebig umprogrammieren und erweitern. Die Skriptsprache wurde speziell für die Webentwicklung erfunden und gilt als sehr einfach zu lernen und zu benutzen. Ähnlich wie Python, Perl oder Ruby lässt sie sich auch für die Programmierung eigenständiger Server- und Desktop-Programme einsetzen. PHP 7 stellt einen wichtigen Meilenstein in der Versionsgeschichte dar. Viele grundlegende Datenstrukturen und Funktionen wurden optimiert, wodurch die Sprache deutlich schneller, sicherer und Speicher-effizienter ist als die vorherigen Versionen.

MySQL

Das Fundament der meisten Content-Management-Systeme ist eine Datenbank, wobei oft MySQL zum Einsatz kommt. MySQL ist ein relationales Datenbank-Managementsystem oder RDBMS, das auf untereinander verknüpften Tabellen basiert. Durch die Verknüpfungen, auch Relationen genannt, entsteht ein komplexes und flexibles Informationssystem. Richtig designte SQL-Datenbanken sind sehr ressourcenschonend und schnell, da jede Information nur einmal gespeichert wird. Der Name dieses Datenbanktyps leitet sich von der Structured Query Language ab, einer einfachen Sprache für Verwaltung und Abfrage der Daten. Der WP-Spezialist kann Tabellen erstellen und Abfragen schreiben sowie redundante Daten per Normalisierung vermeiden. Als Webentwickler muss er verstehen, wie HTML-Formulare, PHP-Code und SQL-Befehle zusammenhängen, um SQL-Injections und ähnliche Sicherheitslücken zu verhindern.

HTML & CSS

HTML und CSS sind die fundamentalen Sprachen des World Wide Web. Streng genommen sind es keine Programmiersprachen, sondern Auszeichnungs- und Design-Sprachen. Modernes HTML beschreibt nur den logischen, strukturellen und semantischen Aufbau einer Webseite. Mit HTML teilt der Entwickler die Inhalte in Abschnitte und Blöcke auf, um das Grundgerüst der Seite zu erstellen. Für das visuelle Design kommen die Cascading Style Sheets zum Einsatz. Designer geben mit CSS an, welche Farben, Schriftarten, Rahmen, Größen und Anordnungen die Seitenelemente haben. Diese Trennung von Struktur, Design und Inhalt ermöglicht flexible Seiten, vielfältige Anpassungen und eine leichte Pflege des Contents.

Arbeiten mit Texteditoren

Für die Entwicklung von Webseiten kommen üblicherweise keine Textverarbeitungsprogramme wie Word zum Einsatz. Stattdessen arbeitet der Experte mit speziellen Texteditoren oder integrierten Entwicklungsumgebungen. Solche Code-Editoren unterstützen den Programmierer auf vielfältige Weise bei der Programmierung und dem Designen der Webseite. Hierzu zählen Syntaxhervorhebung, automatische Einrückung und Vervollständigung, Vorlagen und Textschnipsel, Aufruf externer Hilfsprogramme, Projektverwaltung, integrierte Dokumentation sowie Funktionen für die Fehlersuche. Viele Programmierer-Editoren sind selbst programmierbar und lassen sich mit Tastatur-Makros und speziellen Plugins für Webentwickler individuell anpassen.

WordPress Themes bearbeiten

Zu den häufigsten Aufgaben eines Web-Designers gehört das Anpassen des visuellen Erscheinungsbildes. Themes lassen sich auf mehreren Ebenen verändern. Im einfachsten Fall hat die Vorlage verschiedene Einstellungen für Farben und Schriftarten oder sie enthält einen umfangreichen Customizer. Für umfassende Änderungen sind ein Umschreiben des HTML-, CSS- und PHP-Codes in den Template- und Themedateien nötig. Das grafische Design einer Webseite ist ein wichtiger Faktor für den Erfolg eines Internet-Auftritts. Der kompetente Experte kann nicht nur Themes erstellen und bearbeiten. Er hat auch Grundkenntnisse in Bereichen wie Wahrnehmungspsychologie, Farblehre und Software-Ergonomie, wodurch er den Kunden mit einer Stil-Beratung unterstützen kann.

Webserver aufsetzen und einrichten

Die meisten Webhoster bieten Tarife mit vorkonfigurierten Servern und Webanwendung an. Dennoch kann es vorkommen, dass der WP-Experte einen Webserver selbst installieren und einrichten muss. Das Aufsetzen eines lokalen Servers für die Entwicklung ist mit Programmen wie XAMPP einfach und unproblematisch. Wer jedoch öffentlich erreichbare Webprojekte komplett eigenständig aufsetzen möchte, der benötigt hervorragende Fachkenntnisse in der Server- und Betriebssystem-Konfiguration. Aufgrund der Dominanz des Betriebssystems Linux im Webhosting, können nur wenige Entwickler auf fortgeschrittene Linux-Kompetenzen verzichten.

Domains, URLs und HTTPS

Da der WP-Spezialist häufig auch die gesamte Einrichtung des Webprojektes übernimmt, sind Kenntnisse in der allgemeinen Web-Architektur erforderlich. Im Auftrag der Kunden registriert der Experte Domainnamen und besorgt SSL-Zertifikate für die verschlüsselte Datenübertragung per HTTPS. Wer als SEO-Consultant oder in der Online-Marketing-Beratung arbeiten will, der braucht ein gutes Verständnis für Themen wie Suchmaschinen-optimierte URLs, Permalinks und HTTP-Weiterleitungen. Hierbei ist besonders der Aufbau der internen Verlinkung wichtig, um doppelte Inhalte, im Fachjargon von Webentwicklern Duplicate Content genannt, zu vermeiden.

Fortgeschrittene WordPress-Entwicklung

In der Standardinstallation kennt das CMS nur wenige Webseiten-Typen. Zwar lässt sich die Webanwendung durch Plugins vielfältig anpassen und umbauen, doch nicht immer gibt es Erweiterungen für den spezifischen Einsatzzweck. Hat der Kunde spezielle Wünsche und Anforderungen, sind Entwickler mit fortgeschrittenen Fähigkeiten gefragt. Der erfahrene WP-Experte legt neue Inhaltstypen und Taxonomien an, bearbeitet die Datenbank und entwickelt Templates, Themes sowie individuelle Funktionen und Plugins. Der Spezialist sollte sich darüber hinaus mit Absicherung, Deployment und externen Schnittstellen auskennen.

Die WordPress Datenbank

Die Datenbank der Webanwendung besteht aus mehreren Tabellen für Nutzer, Artikel und Kommentare sowie für Kategorien, Schlagwörter und andere Taxonomien. Mit ihnen lassen sich bereits viele unterschiedliche Inhaltstypen umsetzen. Der Spezialist muss das Zusammenspiel der einzelnen Tabellen verstehen, in der Lage sein, neue Tabellen anzulegen und entsprechende SQL-Abfragen zu schreiben. Da die Datenbank einen zentralen Aspekt der Software darstellt, erfordern Änderungen an ihr Vorsicht und Fachwissen. Fehler in der Datenbank können sehr kritisch sein und Performanzprobleme, Instabilitäten und Darstellungsfehler sowie Sicherheitslecks und Datenschutzlücken verursachen.

Der Loop

Damit aus den Inhalten der Datenbank eine Webseite entsteht, muss das CMS die Artikel und Kommentare in HTML-Dokumente umwandeln. Dafür ist der sogenannte Loop im PHP-Code verantwortlich. Diese zentrale Hauptschleife liest die Daten aus der Datenbank heraus und trägt die Informationen an den vorgesehenen Stellen in das Seiten-Template ein. Dabei prüft der Loop jeden Inhalt und entscheidet, ob er in der aktuellen Seite angezeigt werden soll. Die Schleife ist für Template-Designer und Plugin-Entwickler gleichermaßen wichtig. Ohne Änderungen an ihr erscheinen benutzerdefinierte Felder, Posttypen und andere fortgeschrittene Anpassungen nicht in der schlussendlichen Webseite.

Benutzerdefinierte Felder

Lange Zeit war einer der Kritikpunkte von Webentwicklern, dass WordPress keine frei definierbaren Datenbankfelder unterstützt. Dadurch war die Webanwendung auf Blogartikel und ähnliche Seiteninhalte beschränkt. Mit benutzerdefinierten Feldern, im englischen Custom Fields genannt, lassen sich zusätzliche Informationen und Daten zu den Artikeln hinzufügen. Erst die Custom Fields und Posttypen machen die Software zu einem vollständigen CMS, da sie Webseiten ermöglichen, deren Inhalte nicht in das Blog-Schema passen. Obwohl sich benutzerdefinierte Felder bequem im Administrations-Backend anlegen lassen, erfordert das Anzeigen der Daten manuelle Anpassungen im PHP-Code des Templates.

Taxonomien

Taxonomien sind ein weiteres wichtiges Konzept beim Aufbau individueller Websites. Das Wort stammt aus dem Griechischen und bedeutet in etwa systematische Gruppierung, Klassifikation oder Ordnungssystem. Mit ihnen lassen sich Beiträge in benutzerdefinierten Gruppen, Rubriken, Kategorien oder anderen Klassen einordnen, um die Seiteninhalte besser zu strukturieren. Tatsächlich sind die in WordPress standardmäßig enthaltenen Kategorien und Schlagwörter vordefinierte Taxonomien. Die Einsatzbereiche sind wie bei den Custom Fields und Posttypen sehr vielfältig. Erwähnenswert ist auch die Möglichkeit, interne Taxonomien anzulegen, welche die Webseitenbesucher nicht zu sehen bekommen. Dadurch lassen sich Inhalte für Verwaltungsaufgaben wie Überarbeiten, Nachbestellen und ähnliches kategorisieren.

Posttypen

Obwohl Custom Fields und Taxonomien das CMS flexibler machen, ändern sie nur wenig an der generellen Struktur der Seiteninhalte. Benutzerdefinierte Artikeltypen, oder Custom Post Types, erlauben Inhalte abseits von Blogartikeln und statischen Seiten. Beispielsweise nutzt das Webshop-Plugin WooCommerce Posttypen und Taxonomien, um Produkte, Bestellungen, Coupons und ähnliches zu implementieren. Posttypen sind damit einer der wichtigsten Bausteine für die Entwicklung individueller Webprojekte.

Sicherheit

Die Zeiten eines nachlässigen Umgangs mit der Computer- und Internetsicherheit sind endgültig vorbei. Ungesicherte Webseiten stellen nicht nur ein Problem für die eigene Firma dar, sie sind auch eine Gefahr für das gesamte restliche Internet. Infiltrierte und gehackte Server können als Spam- und Malware-Verteiler sowie als Sprungbretter für Angriffe auf weitere Systeme missbraucht werden. Für ein gut gesichertes Webprojekt sind vom Webentwickler durchgeführte Einstellungen und Anpassungen auf vielen Ebenen nötig. Dazu zählen die Konfiguration von Server und Webanwendung, PHP-Einstellungen, Login-Absicherung inklusive Passwort-Verschlüsselung sowie die Rechtesysteme und Benutzerprivilegien der Datenbank und des unterliegenden Betriebssystems.

Themes von Grund auf entwickeln

Zwar gibt es für das CMS unzählige kostenlose und kostenpflichtige Themes, doch nicht immer sind fertige Designs für ein Webprojekt geeignet. Zum einen möchten einige Freelancer oder Design-Agenturen mit eigenen Themes Geld verdienen. Zum anderen können Copyright- und Lizenzprobleme sowie Entwicklungskosten eine Rolle spielen. Manchmal ist es einfacher, ein Theme von Grund auf selbst zu entwickeln, anstatt bestehende Designs zu verändern. Vor allem bei umfangreichen Anpassungen, speziellen Kundenwünschen und Webseiten mit untypischem Aufbau kann eine Neu-Entwicklung günstiger sein.

Entwicklung von Plugins

Mit Plugins lässt sich der Funktionsumfang der Webanwendung beliebig erweitern, ohne die eigentliche Software umschreiben zu müssen. Ähnlich wie bei den Themes gilt, dass nicht immer geeignete Erweiterungen verfügbar sind oder Anpassungen und Überarbeitungen benötigen. Plugins greifen in den Programmablauf ein und können dementsprechend schwere Sicherheitslecks, Instabilitäten und andere Probleme nach sich ziehen. Beispielsweise kann eine schlecht geschriebene Erweiterung für Zahlungsmethoden oder Anbindung an Warenwirtschaftssysteme finanzielle Schäden verursachen. Die Plugin-Programmierung erfordert daher kompetente Programmierer, die ein gutes Verständnis der Programmiersprache PHP und der Plugin-Schnittstelle haben.

WordPress REST API

Seit Version 4.7 unterstützt das CM-System eine weitere Methode, um beliebige Webanwendung zu bauen. Die REST-API ist eine Schnittstelle für den Datenaustausch mit anderen Computern und Programmen. REST steht für Representational State Transfer und bezeichnet eine Kommunikationstechnik, mit der Webdienste und Anwendungen JSON-Objekte per HTTP übertragen. Sie kann kompliziertere Schnittstellen wie SOAP und RPC ersetzen und stellt eine Alternative zu der Browser-Server-Schnitstelle AJAX dar. Die REST-API ermöglicht vielfältige Einsatzbereiche. Beispielsweise lassen sich Inhalte anderer Webseiten integrieren oder Anbindungen an Webshops, ERP-Systeme und Desktopprogramme realisieren.

Professionelle Webentwicklung auf WordPress-Basis mit dem Roots-Stack

Während das CMS früher vor allem für kleine Blogs und einfache Firmenseiten zum Einsatz kam, entstehen heute immer mehr große und aufwendige Web-Projekte. Komplexe Software-Systeme erfordern professionelle Entwicklungsmethoden und eine geordnete Projektstruktur. Roots.io ist eine Werkzeugsammlung für die fortgeschrittene WordPress-Entwicklung. Sie besteht aus den drei Komponenten Sage, Bedrock und Trellis, die sich als gemeinsame Plattform aber auch eigenständig und mit anderen Entwicklungs-Tools nutzen lassen.

Theme-Entwicklung auf Basis von Sage

Sage ist ein Starter-Theme, mit der sich die Neuentwicklung moderner und fehlerfreier Designs leichter bewältigen lässt. Starter-Themes, auch Bare-bones- oder Blank-Themes genannt, sind grundlegende Basis-Designs, die nur das Grundgerüst eines vollständigen Themes enthalten. Sage nutzt die vereinfachte Stylesheet-Sprache SASS und enthält einen Konverter, um SASS-Designs in CSS umzuwandeln. Hinzu kommen von professionellen Webentwicklern geschätzte Hilfsmittel wie Fehleranalyse-Tools und Paketmanager für JavaScript, das Build-System Gulp sowie HTML-, CSS- und JavaScript-Kompressoren für ein beschleunigtes Laden der Webseite.

Professionelle Struktur mit Bedrock

Das Tool Bedrock optimiert die wiederkehrenden Abläufe und Aufgaben in der WP-Entwicklung durch eine professionelle Projektstruktur. Der veränderte Verzeichnisaufbau erhöht zum einen die Sicherheit, indem es die internen und öffentlich zugänglichen Dateien besser voneinander trennt. Zum anderen erleichtert er die Installation, Aktualisierung und Synchronisation von Plugins. Dazu integriert das Programm den PHP-Paketmanager Composer, der die benötigten Erweiterungen samt ihrer Abhängigkeiten automatisch herunterlädt und installiert. Des Weiteren verwaltet Bedrock die verschiedenen Konfigurationen für Entwicklungs-, Test- und Produktionsserver. Das ermöglicht die Entwicklung auf einer einzigen Code-Basis mit einheitlicher Versionskontrolle per Git, Mercurial oder Bazaar.

Entwicklung und Deployment mit Trellis

Trellis automatisiert die Installation und Auslieferung von WordPress-Systemen. Zunächst erzeugt und verwaltet es virtuelle Maschinen und installiert das CMS sowie alle benötigten Programme auf dem lokalen Rechner. Anschließend kann es die gesamte Webanwendung mit einem Befehl auf die Test- und Produktionsserver übertragen. Auf diese Weise arbeitet der Programmierer mit einem exakten Duplikat der schlussendlichen Webseite. Trellis läuft auf Linux, macOS und Windows 10, wobei einige Tools das Windows Subsystem for Linux benötigen.

5. Fazit: Roots bringt die WordPress-Entwicklung auf ein professionelles Niveau

WordPress ist zu einem vollständigen Content-Management-System herangereift, das sich gleichermaßen für kleine Blogs und komplexe Webanwendungen eignet. Die Software ist bewusst einfach gehalten, um auch Hobbydesignern die Erstellung einfacher Webseiten zu ermöglichen. Entwickler, die große Projekte aufbauen wollen, erhalten mit dem Roots-Stack eine professionelle Plattform für die moderne Web-Programmierung.