Profis mit Erfahrung
Der WordPress Leitfaden
In der WordPress-Welt gibt es einige Grundbegriffe, die man unbedingt kennen sollte. Unser WordPress Leitfaden hilft am Weg zur eigenen Website.
In der WordPress-Welt gibt es einige Grundbegriffe, die man unbedingt kennen sollte. Unser WordPress Leitfaden hilft am Weg zur eigenen Website.
Einerseits werden viele Dinge immer einfacher, und andererseits dann wieder doch nicht. Wer eine WordPress-Website selbst erstellen will, der stößt auf Begriffe wie Theme, Child Theme, Vorlagen, Page Builder und Gutenberg. Sie kennen sich eh aus und wissen genau, was Sie für Ihre Website benötigen? Wir gratulieren herzlich. Für alle anderen gibt es diesen WordPress Leitfaden.
WordPress wurde erst einmal als Blog-System entwickelt. Man sollte ohne jegliche technische Kenntnisse tagebuch-artige Inhalte ins Netz stellen können. Später kamen dann weitere, für die Erstellung von Websites hilfreiche Fähigkeiten hinzu, sodass man WordPress längst nicht mehr als Blog-System ab tun kann.
Im Kern stellt WordPress eine Art Werkzeugkasten dar. Entwickler (Programmierer/innen) können sich daran bedienen, um Themes und Plugins zu programmieren, die eine Website nicht nur gut aussehen lassen (die Aufgabe von Themes), sondern auch um viele interessante Funktionen (die Aufgabe von Plugins) erweitern.
Ohne ein Theme würde WordPress keine Inhalte zeigen. Na gut, stimmt so nicht ganz. Denn in Zukunft kann WordPress sogar die Ausgabe von Inhalten am Kühlschrank-Display, auf digitalen Werbeplakaten oder sonstigen Geräten unterstützen. Aber lassen wir das Stichwort Headless CMS beiseite, und reden nur über WordPress als System zur Erstellung von Websites, wie es sich 2022 darstellt.
WordPress unterstützt einerseits Redakteur/innen dabei, Inhalte in die Datenbank zu schreiben, die im Hintergrund arbeitet, und andererseits bei Aufruf einer Seite der Website die entsprechenden Inhalte aus der Datenbank auszulesen und zu zeigen. Das betrifft neben den Inhalten von Seiten und Beiträgen auch die Menüs und die Inhalte von Fußzeilen und Seitenleisten.
Es ist aber nicht Aufgabe von WordPress, sich um das Aussehen der Website zu kümmern. Dazu braucht es ein Theme. Lesen Sie bitte weiter im WordPress Leitfaden.
Um es klar zu machen- wir reden in diesem WordPress Leitfaden von der frei verfügbaren Software WordPress, die auf der Website wordpress.org beherbergt wird. Wir beziehen uns nicht auf die Plattform wordpress.com, die in den USA daheim ist.
Was ist der Unterschied?
Bei wordpress.com melden Sie sich an, und beginnen mit der Einrichtung Ihrer Website. Das funktioniert ähnlich wie beim Anlegen eines Facebook Profils.
In der kostenlosen Variante veröffentlichen Sie Ihre Website unter einer Subdomain von wordpress.com, etwa wie ewerkstatt.wordpress.com. Wenn Sie einen Tarif wählen, können Sie u.a. auch eine eigene Domain für diese Website benutzen. Domain-Mailboxen sind allerdings nicht möglich, wordpress.com verweist auf die Nutzung von gmail-Adressen..
Die freie Software WordPress können Sie bei beliebigen Hosting Providern mit nur wenigen Klicks installieren, eine manuelle Installation ist heutzutage nicht mehr nötig.
Die Nutzung der freien Software WordPress bietet Ihnen die Möglichkeit, Ihre Website mit Theme und Plugins Ihrer Wahl kräftig zu erweitern. Kurz gesagt, Sie können bei dieser Variante der WordPress Website tun, was immer Sie tun wollen. Und Sie können Mailboxen mit Ihrem eigenen Domainnamen einrichten, weil Sie ja bei einem Full-Provider Ihrer Wahl untergekommen sind.
Im Folgenden beschäftigen wir uns nur mit dieser Variante.
So können Sie rasch eine WordPress Website bei Ihrem Hosting Provider anlegen.
ihredomain/wp-admin/.
Noch ein Hinweis: die Preisunterschiede bei Website-Hosting Produkten ergeben sich aus den Ressourcen, die Ihrer Website zur Verfügung gestellt werden. Unserer Erfahrung nach sind diese erst ausreichend, wenn der monatliche Preis für das Hosting ab etwa € 7,- aufwärts beträgt.
In der Frühzeit von WordPress war man sehr stark auf Themes angewiesen, um ein bestimmtes Aussehen der Website zu erreichen. Das Theme hatte damals einfach alles bestimmt: Farben, Schriftarten, Layout. Eine Änderung solcher Basis-Eigenschaften war nicht möglich, alles war im Theme fix verdrahtet. Später ermöglichten manche Themes dann zumindest eine halbwegs interessante Gestaltung der Startseite von Websites. Auch das war aber fix verdrahtet, Abweichungen von der Vorgabe waren kaum möglich.
Nach wie vor können Sie unter einer Vielzahl von kostenlosen Themes auswählen. Die meisten Menschen versuchen ihr optimales Theme anhand der Bilder und der Farbkombination auszuwählen, wie es in der Theme-Vorschau gezeigt wird. Das sollten aber keine Auswahlkriterien sein. Viel wesentlicher ist die Flexibilität des Themes. Mehr dazu weiter unten.
Bei heutigen Themes finden Sie eine Vielzahl von Einstellungsmöglichkeiten für Layout, Schriftarten, Farben und mehr. So kann dasselbe Theme ganz unterschiedlich aussehende Websites ermöglichen. In diesem Sinne wählt man ein Theme besser nicht nach Screenshots aus, die mithilfe von Fotos einen bestimmten Verwendungszweck suggerieren (Website für Rechtsanwälte, Swimming Pool Hersteller, oder Rauchfangkehrer). Das sagt leider nichts über die Qualität eines Themes aus.
Manche Themes bieten auch eigene Vorlagen (Templates, Starter-Designs) an. Mit deren Hilfe kann man schnell eine gut abgestimmte Kombination von Farben, Schriftarten und Layout in die eigenen Theme-Einstellungen importieren. Mit Vorlagen beschäftigen wir uns weiter unten.
Bei Plattformen wie ThemeForest lassen sich unzählige Premium-Themes beschaffen, die man lizensieren muss. Viele dieser Themes verkaufen sich über schöne Fotos, die in den Screenshots und Demo-Vorlagen enthalten sind, oder über den Einsatz imposanter Slideshows. Demo-Bilder müssen Sie sowieso ersetzen, denn häufig dürfen diese in der eigenen Website gar nicht genutzt werden.
Wir stellen zunehmend fest, das solche Themes eher schlecht zu konfigurieren sind. Bereits kleine Änderungen – etwa wegen der nötigen Übersetzung auf Deutsch – zerstören das Layout der Demo-Vorlage. Andere Inhalte müssen in extra vorbereitete Felder eingetragen werden, die Sie erst finden müssen. Die flexiblen Möglichkeiten der Page Builder, die aber sowieso installiert werden müssen, werden dafür nicht genutzt.
Sinnvoller ist die Wahl eines Themes nach den Einstellungsmöglichkeiten, die es bietet, weiters wie diese Einstellungsmöglichkeiten zu bedienen sind, und eventuell auch nach fertigen Vorlagen, die man importieren und danach anpassen kann. Denn die Inhalte (Bild und Text) müssen sowieso von Ihnen beigesteuert werden, dafür werden Sie den aktuellen WordPress Editor Gutenberg oder einen guten Page Builder einsetzen.
Manche Themes liefern allerdings auch weitergehende Funktionalitäten mit. Das können Slideshows sein, Veranstaltungskalender, »Custom Post Types« (eigene Beitragsformen) für die Präsentation eines Portfolios, und mehr. Ein Sonderfall sind Themes, die sogar ihren eigenen Page Builder (s.u.) mitbringen. Vertreter dieser Variante sind die Premium Themes Divi, Avada oder Enfold, das sind durchaus eierlegende Wollmilchsauen.
Die genannten Themes Divi, Avada und Enfold wirken auf erstem Blick interessant, da sie ja alles aus einer Hand anbieten: Design und Layout der gesamten Website, Inhaltsgestaltung mit eigenem Page Builder. Das hat ganz klar seine Vorteile. Aber auch seine Nachteile. Zum einen sind Sie ganz auf die mitgelieferten Eigenschaften angewiesen. Zum anderen sind diese theme-internen Page Builder häufig so umgesetzt, dass das Theme später nicht ohne weitgehendem Verlust der Inhalte gegen ein anderes ersetzt werden kann.
Der Grund: die Umsetzung der Page Builder Bausteine erfolgt mit Hilfe von sogenannten Shortcodes. Das sind WordPress-Spezialbefehle der Form [shortcode attr="beispiel"], die in diesem Fall von den Theme-Entwicklern selbst eingebracht wurden, und ohne aktivem Theme nicht korrekt interpretiert und ausgeführt werden.
Wird ein solches Theme deaktiviert, weil es gegen ein anderes ersetzt wurde, dann erscheint im Inhaltsbereich so etwas wie (im Beispiel von Avada):
[fusion_tabs design="classic" layout="horizontal" justified="no" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="search_type_tabs"] [fusion_tab title="By Event"] IHR INHALT [/fusion_tab] [fusion_tab title="By Participant"] IHR INHALT [/fusion_tab] [/fusion_tabs]
Grund: WordPress weiß nun nicht mehr, was es mit diesen Spezialanweisungen tun soll. Also werden die jetzt einfach ausgegeben. Es müssen daher bei einem Themewechsel die Inhalte vollständig neu angelegt werden. Programmierte »Übersetzungshilfen« gibt es derzeit noch kaum, bzw. funktionieren diese nicht ausreichend gut.
Wir empfehlen daher die Nutzung des eingebauten WordPress-Editors oder eines Page Builders, der für die Umsetzung der gewünschten Darstellung unsichtbare HTML-Kommentare anstelle von Shortcodes benutzt. Sollten Sie eines Tages den Page Builder nicht weiter nutzen wollen, dann werden Ihre Inhalte weiterhin zwar erst einmal ohne Styling, aber auch ohne seltsamen Programmiercode dargestellt.
Manche Themes, wie etwa Jupiter X, lassen zwar die Nutzung eines fremden Page Builder Plugins zu, bieten aber eigene sogenannte Custom Post Types. Damit können in diesem Theme zusätzliche Inhaltsarten, wie beispielsweise Portfolios oder Veranstaltungen, auch ohne entsprechende Plugins erstellt werden. Das klingt erst einmal gut. Aber wer die theme-eigenen Inhaltsarten nutzt, hat sich damit dem Theme zur Gänze ausgeliefert.
Solche Themes werden daher als Themes mit Lock-In Effekt bezeichnet, denn ein Wechsel zu einem anderen Themes bedeutet, dass diese Inhalte völlig neu erstellt werden müssen. Die im Theme eingebauten Custom Post Types sind dann ja nicht mehr vorhanden.
The lock-in problem is when a user is forced to continue using a theme because their data would be lost to them if they switched to another theme.
Justin Thadlock
Die »allmächtigen« Themes sind daher mit Vorsicht zu genießen. Man kann rasch mit Hilfe von importierbaren Vorlagen ein sinnvolles Ergebnis erzielen, und das Arbeiten geht mehr oder weniger leicht von der Hand. Die Schattenseite ist, dass man von einem solchen Theme später nur mehr mit enorm viel Aufwand loskommt. Es kommt der Neuerrichtung der Website gleich.
Solche Themes erkennen Sie daran, dass gerne auch diese Funktionen zusätzlich angeboten werden:
Wir raten dagegen dazu, für die aufgezählten Funktionalitäten vom Theme unabhängige Plugins einzusetzen. Diese können im Fall des Falles gegen andere getauscht werden, ohne dass nun deswegen gleich die komplette Website inhaltlich und design-mäßig erneuert werden muss.
Mit dem Theme mitgelieferte Slideshows oder Page Builder von Dritten lassen sich übrigens nicht so einfach selbst aktualisieren, sondern man muss auf die Aktualisierung des Themes warten. Das kann im Fall von aufgetauchten Sicherheitslücken unangenehm sein, weil diese Sicherheitslücke u.U. nicht rasch genug behoben wird.
Wir empfehlen, sich ein Theme auszusuchen, das sich nur auf Grundeinstellungen beschränkt, dafür aber eine vielfältige Gestaltungsmöglichkeit zulässt:
Darüber hinaus sollte ein Theme kein zusätzliches Angebot machen. Denn die konkreten Inhalte werden mit Gutenberg (s.u.) oder Page Buildern (s.u.) gestaltet. Das gibt Ihnen die Möglichkeit, das Theme einmal zu wechseln, ohne deswegen alle Inhalte neu erstellen und gestalten zu müssen.
Vertreter solcher Themes sind u.a.
WordPress hatte schon nahezu von Beginn an mit sogenannten Widgets aufgewartet. Widgets sind Inhaltsbausteine, die auf vordefinierten Widget-Areas (Plätze), wie Seitenleiste oder Fußzeile, untergebracht werden können, sodass sie auf der ganzen Website sichtbar sind. Häufig genutzte Widgets sind etwa Text-, Bild-, Navigationsmenü oder Suchformular-Widgets. Widgets kann sich bildlich vorstellen als eine Art Plastikbausteine (denken Sie an die Marke mit den 4 Buchstaben E, G, L, O), die man auf die Grundplatte, die Widget-Area, stecken kann.
Aktuell stellt WordPress um auf die Nutzung von Blöcken (s.u.) auch für die Widget-Areas. In Block-Themes wie Twenty Twenty-Two gibt es gar keine Widget-Areas mehr, an deren Stelle treten Template-Teile.
Aber die Bedeutung von Widgets hat sowieso stark nachgelassen. Website-übergreifende Seitenleisten werden in modernen Websites kaum mehr verwendet (am ehesten noch in Blog-Bereichen), und die Gestaltung der Fußzeile erfolgt meist in den jeweiligen Theme-Einstellungen oder unter Nutzung der Fähigkeiten guter Page Builder (s.u.).
Gestatten Sie einen kurzen technischen Ausflug im WordPress Leitfaden, denn diese drei Begriffe könnten für Sie ebenfalls einmal von Bedeutung sein.
WordPress hat für die erzeugte HTML-Struktur (jede Webseite ist ein HTML-Dokument) und unabhängig vom eingesetzten Theme einige Haken vorbereitet, auf englisch Hooks. Auf diesen Haken können nun Themes, Plugins oder auch Sie selbst etwa mit Hilfe eines Plugins wie Code Snippets die Ausführung von eigenen Funktionen »aufhängen«. Dadurch werden solche eigenen Funktionen an diesen Stellen ausgeführt.
Die Hooks haben Namen wie:
wp_head
wp_footer
the_content
comment_form_after
Daran lässt sich schon ganz gut erkennen, wo im gesamten Dokument der jeweilige Haken auftaucht.
An der Position dieser Hooks können zwei Arten von Funktionen zum Einsatz gebracht werden:
Mit Hilfe von Hooks und daran anbringbaren Actions und Filter kann nun eine WordPress Website nahezu unbegrenzt vollkommen verändert werden, unabhängig von den Möglichkeiten, die Ihr Theme anbietet. Manche Themes bringen sogar zusätzliche Hooks ins Spiel, so dass Sie beispielsweise eine Produktdetail-Seite in Ihrem Onlinshop weitgehend verändern können. Nahezu alle Plugins benötigen die Standard-Hooks von WordPress unbedingt, weil die ja entweder zusätzliche Inhalte ausgeben, oder Änderungen an bestehenden Inhalten vornehmen.
Einfache Code-Beispiele finden Sie etwa bei diesem Artikel auf addictedtocode.de
Ende des Technik-Ausflugs.
In manchen Fällen wird man mit der Frage konfrontiert, ob man ein Child Theme installieren möchte. Das passiert beim Importieren von kompletten Demo-Vorlagen (s.u.), oder wenn man im Internet nach Lösungsvorschlägen für theme-technische Fragen sucht.
Child Themes wurden von WordPress schon vor vielen Jahren ins Spiel gebracht, um Änderungen an Theme-Dateien vornehmen zu können, ohne dass diese Änderungen bei einer Aktualisierung des Themes wieder verloren gehen. Bei Child Themes werden nur Kopien einzelner Dateien des Original-Themes in das Verzeichnis des Child Themes abgelegt. Alle anderen Dateien sucht WordPress im Verzeichnis des Original-, also Eltern-Themes. Das hat Vor- und Nachteile.
Ihre eigener Code für Theme-Dateien bleibt erhalten, auch wenn alle Eltern-Theme Dateien aktualisiert werden.
Die Kopien der Theme-Dateien, die man ändern musste, werden ja den Aktualisierungen des Original-Themes vorenthalten. Das führt aber im Lauf der Zeit dazu, dass sich die (eingefrorenen) Versionen der kopierten Dateien zunehmend von den aktuellen Theme-Versionen unterscheiden, und es daher später einmal zu mysteriösen Fehlfunktionen der Website kommen kann.
Wenn Sie keine Änderungen am Theme vornehmen müssen, die nicht auch auf andere Art durchführbar ist, dann verzichten Sie auf die Nutzung eines Child Themes. Änderungen, für die Ihr Theme keine Umsetzung anbietet, können Sie auch mit Plugins, wie Code Snippets oder WPCode erreichen. Im Fall eines Online-Shops stehen für eine Umgestaltung von Produkt-Seiten, der Kassa-Seite oder der E-Mail Vorlagen spezielle Plugins zur Verfügung.
Eigenen CSS Code tragen Sie auch besser unter Nutzung des Plugins Code Snippets oder eines ähnlichen ein. Denn wer dafür die von WordPress vorgesehen Umsetzung in den WordPress Einstellungen (Design / Customizer / Zusätzliches CSS) benutzt, füllt damit die WordPress Datenbank mit unnötig vielen Zwischenspeicherungen an, das mussten wir mittlerweile feststellen.
Wenn sich Ihre Änderungswünsche mit solchen Plugins nicht umsetzen lassen, oder wenn Sie wissen, dass Sie ausschließlich nur in der Theme Datei functions.php etwas tun müssen (die gefundene Anleitung aus dem Internet sagt Ihnen das), dann erst ziehen Sie dafür ein Child Theme in Betracht. Entweder liefert Ihr Theme ein solches Child Theme bereits mit, oder Sie können es mit einem Plugin wie dem Child Theme Configurator selbst erstellen.
Vielleicht können Sie sich noch an die frühen Websites erinnern: Textwüsten, in denen nur ab und zu ein Bild für etwas Abwechslung gesorgt hatte. Mehrspaltigkeit war nur unter Aufbietung von Gewalt zu erreichen. Naja, okay, es wurden dafür Tabellen missbraucht. Schlimm genug. Tabellen sollte wirklich nicht für Layout-Aufgaben eingesetzt werden, sondern nur zur Darstellung von Daten.
Also hatten sich Entwickler Möglichkeiten einfallen lassen, wie man wenigstens die Homepage einer WordPress Website, das ist die Startseite (Frontpage), interessant aufbereiten konnte. Das Ergebnis waren Themes mit fix vorgebenen Möglichkeiten die Startseite mit einem besonderem Layout auszustatten.
Findige Köpfe hatten sich in Folge eine Möglichkeit ausgedacht, wie eine solche Layout-Gestaltung flexibel und für alle Seiten machbar wäre, und nicht nur für die Startseite. Die Gattung der Page Builder war geboren.
Das Arbeitsprinzip von Page Buildern ist üblicherweise immer dasselbe, nur die Bezeichnungen für deren Bestandteile sind oft unterschiedlich.
Ihre Inhalte, wie Absätze, Überschriften, Bilder, etc., stecken in Spalten, und diese wiederum in Containern (andere Bezeichnungen: Zeile, Abschnitt). Spalten und Container bieten zumeist vielfältige Gestaltungsmöglichkeiten, etwa durch die Nutzung von Hintergrundfarben oder -bildern, Rahmen, etc.
Das folgende Bild zeigt Ihnen die Arbeit im Page Builder Elementor. Der gezeigte Abschnitt (blaue Umrandung) beinhaltet zwei Spalten (gepunktete Umrandung der gerade aktiven linken Spalte). In der linken Spalte befinden sich Überschrift und Text, in der rechten Spalte sitzt ein Bild.
Der Vorteil dabei: Sie können für nahezu alle diese Bestandteile deren Aussehen bestimmen, und diese Bausteine später auch verschieben, kopieren, duplizieren oder als eigene Vorlage speichern.
Sie legen Rahmen und Hintergründe fest, bestimmen die Breite von Abschnitten und Spalten, und stellen diverse Abstände nach innen sowie nach außen ein. Bei manchen Page Buildern können Sie auch Animationen aktivieren, etwa ein Einfliegen des Objekts von der Seite beim Scrollen.
So besteht der gesamte Inhalt einer Seite aus einer Abfolge an Containern mit den jeweiligen Inhalten darin, damit Sie die Seite auch wirklich abwechslungsreich gestalten können.
Damit steigt zwar der Aufwand für die redaktionelle Arbeit, aber Sie können sich durch den Import von Vorlagen entweder ganzer Seiten oder von Teilen helfen lassen.
Das sind einige bekannte und weithin genutzte Page Builder zusätzlich den o.a. theme-eigenen Page Buildern:
Nahezu alle Page Builder werden als Freemium Modell zur kostenlosen Nutzung angeboten, Bricks muss man dagegen immer lizensieren. Wer weitergehende Funktionen benötigt, greift zur jeweiligen Premium Version, und genießt dann auch Support durch die Theme-Hersteller. Das empfehlen wir, da die Nutzung eines solchen Page Builders eine Kernfunktion Ihrers digitalen Angebots darstellt, und daher friktionsfrei funktionieren sollte. Fragen können schnell auftauchen, und sollen zeitnahe und profund beantwortet werden.
Hat die Nutzung von Page Buildern auch Nachteile? Durchaus. Zum einen kämpfen die Entwickler Teams mit Performance Problemen ihrer Page Builder. Das bessert sich gerade, reicht aber noch nicht aus. Zum anderen ist die Zahl der Entwickler bei Unternehmen immer begrenzt im Vergleich zur Mitarbeit an WordPress durch die große Open Source Gemeinde. Und das bedeutet, dass manche nötigen Entwicklungen auf sich warten lassen. Und zuletzt wäre es fein, wenn Ihr Wunsch Page Builder nicht mit Short Codes arbeiten würde, damit Sie bei einem Wechsel keinen Buchstabensalat in Ihrer Website entfernen müssen.
In Reaktion auf die wunderbare Welt der Page Builder hatten die WordPress Entwickler sich ihren eigenen Weg ausgedacht, wie sich Inhalte interessant aufbereiten lassen. Das Ergebnis ist der aktuelle WordPress Block-Editor. Er wird vielfach als »Gutenberg« bezeichnt, weil WordPress den Block-Editor erst mal nur als Plugin Namens Gutenberg angeboten hatte. Wer heute WordPress installiert, sollte aber das Plugin Gutenberg nicht auch noch zusätzlich installieren, außer man möchte die Entwicklung des Editors mitverfolgen. Viele Menschen sprechen vom WordPress Editor und nutzen dafür das Wort »Gutenberg«, was aber genau genommen nicht korrekt ist.
Der Block-Editor geht einen etwas anderen Weg als Page Builder. Alle inhaltlichen Elemente sind Blöcke, daher eben die Bezeichnung Block-Editor. Eine Dreiteilung Abschnitt/Spalte/Inhaltselement wie bei Page Buildern gibt es nicht. Jeder Block kümmert sich gleichermaßen um den Inhalt und um dessen Gestaltung.
Beispiele für Blöcke sind:
Die Gestaltung der meisten Blöcke betrifft die Breite, Hintergrundfarben, Anordnungen und dergleichen. Der allgemeine Vorteil der Blöcke ist, dass ihr HTML-Code relativ schlank gehalten ist, und damit die Performance einer Website auch ohne Nutzung von Cache-Plugins gut sein kann.
Viele WordPress-Nutzer/innen arbeiten ungern mit Blöcken, da die Gestaltungsmöglichkeit im Vergleich zu Page Buildern derzeit (Stand Mai 2024) immer noch deutlich zu wünschen übrig lässt, so lassen sich derzeit noch immer keine eigenen Dimensionen (Breite von Buttons) eintragen für unterschiedliche Geräteklassen, oder Hintergrundbilder besser ausrichten.
Ein anderer Nachteil ist die vergleichsweise geringere Benutzungsfreundlichkeit, wie es von Teilnehmer/innen unserer Kurse manchmal geäußert wird. Was für eine Person nicht benutzungsfreundlich wirkt, mag für eine andere Person dagegen großartig sein. Und so erscheint der Block-Editor für die redaktionelle Arbeit einfach zu nutzen, aber wenn es um die Aufbereitung der Inhalte geht, dann können die Blöcke mit ihren aktuell vorhandenen Eigenschaften noch sehr »dünn« wirken, vor allem im Bereich des Resposive Design.
Plugin Entwickler füllen diese Lücke, indem sie zusätzliche Blöcke mit umfassender Gestaltungsmöglichkeit anbieten. Solche Block Plugins sind etwa (Auswahl):
Die Gestaltung unserer eigenen Webseite erfolgte zuerst auf Basis von Stackable in der Premium Version, später sind wir umgestiegen zu Greenshift. Derzeit arbeiten wir an einem Relaunch dieser Website mit dem Bricks Builder.
Ende Jänner 2022 ist WordPress 5.9 erschienen, und hat das erste Block-Theme namens Twenty Twenty-Two mitgebracht. Einstellungen für Layout und Design werden bei diesem Theme nur mehr über Gutenberg-Blöcke gemacht, das Prinzip nennt sich Full Site-Editing.
Bei Block-Themes werden im Site-Editor mit Hilfe von Template-Teilen (wie Header und Footer) Templates (»Vorlagen«) für Seiten, Beiträge, Archive, Kategorien, etc., zusammengefügt. Die Block-Themes bringen fertige Templates und Template-Teile mit, es lassen sich aber auch zusätzlich eigene individuelle Template-Teile und Templates erstellen für Seiteb, Beiträge, Archive, Such-Seiten, 404-Seiten, etc.
Es können Layout, Farben und Typographie der Website im Stil-Editor festgelegt werden. Und Block-Themes liefern auch neue inhaltliche Vorlagen (»Pattern«) mit. Damit kann der Inhalt von Seiten so zusammengestellt werden, wie man es schon länger bei Anbietern wie Square Space oder wix kennengelernt hat.
Innerhalb der Template-Teile setzt man Gutenberg-Blöcke ein, die für die Ausgabe auch von Website-übergreifenden Inhalten (Logo, Website-Titel, Navigation, etc.) sorgen. In einem Artikel auf ewerkzeug.info finden Sie dazu Überblick und Anleitung.
Die Kombination von Theme, PageBuilder und/oder Block Editor ist erstmal nur ein Werkzeug, mit dem Sie arbeiten können. Üblicherweise beginnen Sie also bei Null, und Sie können damit nahezu jede Website, die Sie kennen, nachbauen.
Wenn Sie aber mit vorbereiteten Materialien arbeiten möchten, dann können Sie das auch tun. Denn Sie können komplette Vorlagen-Websites übernehmen, die Sie dann anpassen. Solche Vorlagen werden von den meisten Theme-, Gutenberg Block- und Page Builder Entwicklern angeboten. Eine Vorlage benötigt daher immer das spendierende Theme oder zugehörigen Page Builder oder Gutenberg Plugin.
Beim Theme Blocksy nennt sich das etwa »Starter Sites«. Sie müssen nur angeben, ob Sie eine Starter Site für Gutenberg/Stackable oder für Elementor importieren möchten, denn das Theme Blocksy selbst bringt ja kein Werkzeug für die Gestaltung von Inhalten mit.
Elementor und Stackable bieten Ihnen je nach Lizensierung ebenfalls Vorlagen zum Import an. Dabei handelt es sich um fertig konfigurierte Kombinationen der jeweiligen Bausteine. Das sind entweder Blöcke bei Gutenberg/Stackable oder fertige Kombinationen von Abschnitt/Spalte/Element bei Elementor (dort nennt sich das dann Template, also Vorlage auf Deutsch). Elementor bietet mit der Elementor Kits Library auch den Import ganzer Websites an.
Auch für den WordPress Block-Editor gibt es seit August 2021 Vorlagen. Eine Übersicht über die Block-Vorlagen (»Pattern«) erhalten Sie im Verzeichnis bei wordpress.org. Hier ein Beispiel:
Und die Teams von Stackable und Elementor bieten neben deren Vorlagen (»UI Kits« bzw. »Block Designs«) nun auch Wireframes an, darunter kann man so etwas wie abgespeckte Vorlagen verstehen. Hier geht es nicht mehr um Demo-Bilder und Farben, die ablenken würden, sondern die Anordnung von Elementen steht im Vordergrund.
Hat die Nutzung von Vorlagen auch Nachteile? Leider ja.
Zum einen müssen Sie selbst erst entdecken, wie Sie die Inhalte und vor allem die Demo-Bilder der Vorlagen identifizieren und durch Ihre eigenen Inhalte ersetzen können. Das ist oft gar nicht so einfach.
Zum anderen ist die Wahrscheinlichkeit hoch, dass Sie nicht alle Links der Demo-Inhalte finden, die Besucher/innen Ihrer Website aber zielsicher solche Links bald nutzen werden, und dadurch irgendwo landen. Vielleicht auf Ihrer 404-Datei nicht gefunden-Seite oder sie bleiben auf der Seite mit dem Fake-Link.
Und schließlich kann es passieren, dass Sie beim Import von ganzen Demo-Website-Inhalten nicht genau genug die Fragen am Bildschirm gelesen haben, und versehentlich alle Ihre eigenen, bereits bestehenden Inhalte verlieren. Wir empfehlen daher (wie in so vielen anderen Fällen) vorher ein Komplettsicherung der Website durchzuführen.
Wenn Sie dagegen einzelne Wireframes als Vorlage für Ihre Inhalte wählen, werden Sie solche Fallen vermeiden.
WordPress will (derzeit noch) zwei unterschiedlichen Ansprüchen genügen:
Das führt in der Realität dazu, dass die Arbeit in einer frischen Installation von WordPress erst einmal leicht von der Hand geht, aber seitens der Besitzer/innen rasch hohe Ansprüche an die Website gestellt werden.
»Ich brauche eine kleine Website, nicht mehr als 8 bis 10 Seiten Umfang. Da soll man nur die Kurse sehen, die ich anbiete. Die Kurse soll man buchen können. Die Kunden sollen Rechnungen erhalten und Erinnerungsmails. Gebuchte Termine sollen in der Kundenverwaltungssoftware eingetragen werden. Achja, und es soll natürlich dreisprachig ausgeführt werden. Und meine Kunden können in einem eigenen Bereich Materialien downloaden und Videos ansehen. Später braucht es dann eine Schnittstelle zu einm Buchhaltungs- und Faktura-System.
Der unbekannte Auftraggeber
Aber sonst eine einfache Website, bitte, mit nur ganz wenigen Seiten.«
Machbar ist das alles, aber die Befriedigung solcher Ansprüche führt zu einer komplexen Verflechtung von WordPress-Zusatzsoftware, deren Bedienung nicht mehr ganz trivial bleiben kann.
Der Block-Editor wurde ein Kernbestandteil von WordPress und wird das auch bleiben. Die flexiblen Gutenberg Blöcke können bereits jetzt auf Widget-Plätze in klassischen Themes gesetzt werden, die bisherigen Widgets werden wohl bald nur mehr in Form von Gutenberg Blöcken existieren.
Der Block-Editor greift darüber hinaus nach den Sternen. Naja, nicht ganz, aber immerhin nach Kopf- und Fußzeile, sowie nach der Gestaltung von Seiten generell, und das nennt sich Full-Site-Editing (FSE). Damit wird von den Themes in Hinkunft immer weniger an Unterstützung bei der Website-Gestaltung benötigt. Denn die Arbeit an Design und Layout erfolgt bei den neuen Block-Themes wie Twenty Twenty-Two nur mehr mithilfe der Einstellungen von Gutenberg-Blöcken.
Aber auch Page Builder mischen sich in die Gestaltung von Kopf- und Fußzeile ein. Daher gibt es besonders für die gemeinsame Nutzung mit Elementor das Theme Hello Elementor, das gar keine Einstellungen und Besonderheiten anbietet. Denn der Page Builder Elementor übernimmt in diesem Fall auch die Gestaltung aller anderen Teile einer Website. Das Theme braucht es nur mehr, weil es technisch von WordPress einfach benötigt wird. Zu tun hat es aber nichts mehr.
Gibt es eine allgemein gültige und immer passende Vorgangsweise bei der Erstellung von Websites mit WordPress? Natürlich nicht. Folgende Kombinationen und Varianten haben wir als erste grobe Leitlinie zusammengetragen.
Anforderung | Umsetzung |
---|---|
Sie wollen rasch eine herzeigbare Website haben, ohne sich mit der Qual der Wahl bei Plugins auseinandersetzen zu müssen. Ein Wechsel zu einem anderen Theme in Zukunft ist unwahrscheinlich. Die Gestaltung der Website muss keine anspruchsvollen und komplexen Vorgaben erfüllen. | Nutzen Sie ein mächtiges Theme mit eingebautem Page Builder, und importieren Sie eine für Sie passende Vorlage als Basis Ihrer Arbeit. Alternativ arbeiten Sie mit einem Block-Theme wie Twenty Twenty-Two, und setzen nur Gutenberg-Blöcke ein. |
Sie wollen bei Ihrer Website Ihre eigenen Corporate Design Anforderungen umsetzen können, die Gestaltung von Inhalten kann eher einfach bleiben. | Nutzen Sie ein Theme, das sich nur um Design und Layout kümmert. Für die Inhalte setzen Sie den WordPress internen Block Editor Gutenberg ein. |
Sie brauchen für Ihre Website umfassende Gestaltungsmöglichkeiten. Wie Sie diese erhalten, ist nebensächlich, aber Ihre Ideen sollen umzusetzen sein. | Nutzen Sie ein Theme, das sich nur um Design und Layout kümmert. Für die Inhalte setzen Sie einen mächtigen Page Builder ein. |
Sie brauchen für Ihre Website umfassende Gestaltungsmöglichkeiten, wollen aber möglichst nahe am WordPress-Block Editor Konzept bleiben. | Nutzen Sie ein Theme, das sich nur um Design und Layout kümmert. Für Erstellung und Gestaltung von Inhalten setzen Sie ein Gutenberg Block Plugin ein. |
Sie möchten mit Vorlagen arbeiten, wollen sich technisch um nichts kümmern und kommen mit Basic-Funktionen für eine Website aus. | Nutzen Sie einen Anbieter wie wix oder Square Space, oder wordpress.com Hinweis: Achten Sie auf die laufenden Kosten bei den Anbietern. Wenn Sie dann doch einmal die Website von wix oder Square Space wegsiedeln wollen, müssen Sie in jedem Fall mit einer neuen Website beginnen. Sehen Sie auch nach, ob Sie Domain-Mailadressen (@ihre-domain) einfach einrichten können. |
Haben Sie Fragen oder Anmerkungen zu unserem WordPress Leitfaden? Nutzen Sie bitte die Kommentarfunktion.
Können wir Sie bei Ihrem Projekt unterstützen? Treten Sie mit uns in Kontakt.
Sie wollen mit WordPress raschestmöglich umgehen können? Melden Sie sich zum Praxiskurs WordPress Basic an.
Danke für die hilfreiche Übersicht. Stehen hier noch ganz am Anfang was WordPress angeht 🙂