Ein früher Blick auf die vollständige Website-Bearbeitung in WordPress

Hier ist eine existenzielle Frage für Webentwickler: Wie viel Trennung sollte zwischen dem Content-Management-System (CMS) einer Website und ihrem Design bestehen?

Bei vielen DIY-Diensten da draußen (Wix, Squarespace usw.) kann fast jede Facette einer Website visuell bearbeitet werden. Ob Inhalt, Design oder Layout, Sie können nach Herzenslust optimieren. Und Sie müssen dazu keinen Code verstehen.

Aber abgesehen von einigen codefreien Seitenerstellungsprodukten hat sich WordPress traditionell von einem ausgewachsenen Website-Editor ferngehalten. Der Theme Customizer ermöglicht es Benutzern, bestimmte Aspekte eines Themes zu ändern – aber nur die, die von seinem Entwickler definiert wurden.

Das wird sich ändern. Mit Full Site Editing (FSE) kann der Gutenberg-Blockeditor zur Bearbeitung der gesamten Website verwendet werden – Thema und alles.

Diese neumodische Funktion kann einfach revolutionieren, was mit einem WordPress-Theme möglich ist. Damit wollte ich einen ersten Blick darauf werfen, was es kann. Hier ist, was ich gefunden habe…

Einrichten der vollständigen Seitenbearbeitung in WordPress

Zum jetzigen Zeitpunkt wurde die vollständige Seitenbearbeitung nicht in den WordPress-Kern integriert. Es ist eine Beta-Funktion, die über das Gutenberg-Plugin verfügbar ist. Also schnappe ich mir das Plugin und aktiviere es zuerst.

Dann ist da noch die Frage, ein kompatibles Thema zu finden. Q ist das erste WordPress-Theme, das FSE unterstützt und als Leinwand für dieses Experiment dienen wird. Nachdem wir das kostenlose Theme installiert und aktiviert haben, können wir uns nun ansehen, was es tut.

Ein weiterer zu beachtender Punkt: Ich mache das alles auf einer lokalen Installation von WordPress. Es gibt eine Menge zu testen und Fehler zu beheben, wenn es um die vollständige Bearbeitung der Website geht. Daher ist es noch nicht bereit für eine Produktionsumgebung. Entsprechend testen!

Erste Beobachtungen

Bei der Aktivierung des Q-Themes gibt es einige auffällige Unterschiede in WordPress. Im Backend gibt es jetzt einen Site-Editor- Eintrag im Menü. Und wenn Sie das Frontend durchsuchen, während Sie angemeldet sind, wird ein Link „ Site bearbeiten “ in der Admin-Leiste angezeigt. Oh, und es gibt auch eine Warnmeldung, dass die vollständige Bearbeitung der Website experimentell ist (wir ignorieren diese einfach).

Das Thema selbst ist ziemlich Barebones – was ideal ist. Dies bietet uns einen einfacheren Weg zur Anpassung. Wenn Sie darüber nachdenken, möchten Sie wahrscheinlich kein kompliziertes Design abreißen, nur um es wieder in etwas anderes aufzubauen. Weniger ist in der Tat mehr.

Ein Blick in den Site-Editor

Nun zu diesem Site-Editor. Ein Klick darauf öffnet den Gutenberg-Blockeditor. Aber dieses Mal ist es mehr als nur eine Standard-Leerseite. Stattdessen habe ich jetzt Zugriff auf alles – Kopfzeile, Navigation (über den experimentellen Navigationsblock), Inhaltsbereich und Fußzeile.

Wie erwartet, müssen Sie zum Ändern eines dieser Elemente in einen Block klicken und sich an die Arbeit machen. Einzelne Blöcke können in etwas anderes umgewandelt, bearbeitet oder sogar gelöscht werden. Blöcke können auch neu positioniert werden. Es war zum Beispiel ein Kinderspiel, das Navigationsmenü über dem Titel der Website zu platzieren. Gleiches gilt für das Ersetzen der einspaltigen Titelüberschrift durch ein mehrspaltiges Layout.

Aber es gibt noch mehr. Klicken Sie auf das WordPress-Logo oben links auf dem Bildschirm und Sie öffnen die Seitenleiste des Website-Editors. Dort können Sie Themenvorlagen (wie die Index- oder Beitragsvorlage der Website) oder Vorlagenteile (wie die Kopf- und Fußzeile ) anzeigen und erstellen. Beachten Sie, dass Sie diese Elemente auch über das Menü „Darstellung“ in WordPress erreichen können. Es gibt auch eine Möglichkeit, zu den Seiten, Beiträgen und Taxonomien der Website zu gelangen.

Was wirklich schön ist, ist, dass Sie die Möglichkeit haben, nur die Vorlagenteile zu isolieren, die Sie bearbeiten möchten. Wenn ich die Kopfzeile von Theme > Template Parts hochziehe, ist das alles, was ich im Blockeditor sehe. Aber wenn ich es lieber im Kontext des gesamten Themas bearbeiten möchte, kann ich einfach auf dieser ursprünglichen Site-Editor-Seite bleiben.

Erstellen neuer Vorlagen

Wenn Sie mit dem Gutenberg-Blockeditor vertraut sind, ist das Erstellen neuer Themenvorlagen ziemlich einfach. Der Prozess ist sehr ähnlich wie bei der Erstellung jeder anderen Seite oder eines anderen Beitrags. Erstellen Sie Ihr gewünschtes Layout mit den verfügbaren Blöcken und speichern Sie – fertig!

Eine Sache, die zu beachten ist, ist, dass an dieser Stelle anscheinend benutzerdefinierte Vorlagen den Namenskonventionen der WordPress-Vorlagenhierarchie folgen müssen. Das heißt, der Slug einer benutzerdefinierten Vorlage sollte mit dem Namen des entsprechenden Zwecks in Ihrem Design übereinstimmen (ohne die .php am Ende).

Wenn Sie beispielsweise eine Vorlage erstellen möchten, die auf Ihrer Homepage verwendet werden soll, sollte ihr Slug den Namen front-page haben. Möchten Sie die Seite „Über uns“ ( yoursite.com/about-us/ ) als Ziel verwenden? Eine Vorlage mit dem Slug von page-about-us reicht aus.

Die Vorlagen stehen über das Einstellungsmenü oben rechts im Editor zum Download bereit. Auf diese Weise können Sie Vorlagen manuell auf Ihrem Gerät speichern und dann auf den Server hochladen, um sich vor möglichen Pannen zu schützen.

Vorlagenteile verwenden

Wie bereits erwähnt, können wir mit der vollständigen Website-Bearbeitung von WordPress Vorlagenteile bearbeiten und erstellen. Dazu gehören die Kopf- und Fußzeile der Website, aber es gibt noch viele andere Möglichkeiten.

Vorlagenteile können erstellt und dann über einen Block in eine beliebige Vorlage eingebunden werden. Sie können auch ein Vorlagenteil zu einer bestimmten Seite oder einem bestimmten Beitrag hinzufügen.

Dies kann sich als nützlich erweisen, wenn Sie einen bestimmten Teil des Inhalts über mehrere Seiten oder Beitragstypen hinweg hinzufügen möchten.

Denken Sie zum Beispiel an einen Block mit hervorgehobenen Beiträgen, den Sie sowohl auf Ihren einzelnen Beiträgen als auch auf Archivseiten anzeigen möchten. Oder vielleicht gibt es ein Navigationsmenü, das nur angezeigt werden soll, wenn eine oder mehrere bestimmte Vorlagen verwendet werden.

Vorlagenteile sind ein Mittel, um dies einzurichten, ohne dass fortgeschrittene Techniken wie bedingte Logik erforderlich sind.

Fragen zur Zukunft von WordPress-Themes

Insgesamt fühlte ich mich positiv über diese Erfahrung mit der vollständigen Bearbeitung der Website. Es gibt noch viel zu tun, um Fehler zu beseitigen und die Benutzerfreundlichkeit zu verbessern. Die Themenunterstützung wird auch eine große Hürde sein. Aber das hat das Potenzial, ein sehr nützliches Feature zu sein.

Dennoch drängen sich einige Fragen auf:

An wen richtet sich die vollständige Seitenbearbeitung?

Eines der übergreifenden Argumente für den Gutenberg-Blockeditor war, dass es notwendig war, die Relevanz zu erhalten. Konkurrenten im DIY-Markt haben eine visuellere Herangehensweise an Baustellen und WordPress war ins Hintertreffen geraten.

Daher ist es sinnvoll, dass die vollständige Bearbeitung der Website auf Benutzer abzielt, die: a) Code nicht kennen oder nicht verwenden möchten; und b) Zugriff auf die meisten (wenn nicht alle) Elemente ihrer Website wünschen.

Was ist drin für Webdesigner?

Es gibt einige Vorteile. Das Öffnen einer Kopfzeile kann es beispielsweise einem Kunden ermöglichen, schnell eine neue Telefonnummer oder Adresse zu aktualisieren. Dies könnte Designern den Umgang mit sehr grundlegenden Änderungen ersparen.

Dennoch wird es einige Dinge geben, die Webprofis sperren möchten. Das Client-Proofing einer Site wird häufig durchgeführt, um sie vor Bruch zu schützen. Layouts und Funktionalität sind essenziell, die wir lieber nicht aufs Spiel setzen.

Hoffen wir, dass es Möglichkeiten gibt, auf einfache Weise eine feinkörnige Kontrolle darüber auszuüben, was im Backend bearbeitet werden kann und was nicht – wie es der vorhandene Design-Anpasser tut. Andernfalls wird dies ein weiterer potenzieller Albtraum, über den man sich Sorgen machen muss.

Wie wirkt sich die vollständige Bearbeitung von Websites auf den Markt für kommerzielle Themen aus?

Das wird faszinierend zu beobachten sein. Im Moment scheinen nur sehr wenige Themen für Gutenberg angepasst worden zu sein. Sie verlassen sich immer noch auf Seitenerstellungs-Plugins von Drittanbietern für erweiterte Layouts. Und einige Produkte, wie Divi und Beaver Builder, verfügen bereits über eigene vollständige Website-Bearbeitungsfunktionen.

Seien Sie daher nicht überrascht, wenn die vollständige Bearbeitung der Website nur langsam angenommen wird. Es ist unwahrscheinlich, dass Theme-Entwickler auf den Zug aufspringen, bis es sowohl eine Nachfrage als auch einen klaren Hinweis darauf gibt, wie sie davon profitieren können. Ganz zu schweigen davon, dass viele vorhandene Funktionen umgestaltet werden müssen.

Aus meiner Sicht müssen Entwickler dies so implementieren, dass die Flexibilität für die Benutzer erhöht und gleichzeitig das Risiko eines Bruchs minimiert wird. Das könnte so aussehen, dass vorgefertigte (und teilweise gesperrte) Vorlagen angeboten werden und die Benutzer auswählen können, welche sie möchten. Aber wir sind noch sehr früh im Spiel.

Ein nahtloseres WordPress

So viel vom WordPress-Ökosystem ist Stückwerk. Schnappen Sie sich ein Thema von hier , ein Plugin von dort (und da und da ) und versuchen Sie, alles zusammenzufügen. Dies ist Teil seiner Anziehungskraft und hat bemerkenswert gut funktioniert.

Aber das Designerlebnis hat von diesem Fluss nicht wirklich profitiert. Das Aussehen und Layout eines Themas war schon immer in irgendeiner Weise getrennt. Egal, ob es darum geht, Vorlagen zu hacken oder den Theme Customizer zu verwenden, es gibt viel Herumlaufen.

Liebe es oder hasse es, die vollständige Seitenbearbeitung ist ein Schritt zur Vereinheitlichung des Designprozesses. Damit kann alles an einem einzigen Ort innerhalb einer einzigen Benutzeroberfläche hergestellt werden. Es ist eine nahtlosere Erfahrung, von der viele Benutzer profitieren sollten.