Erstellung von WordPress Block-Themes und Full-Stack-Bearbeitung

Wenn Sie in letzter Zeit die WordPress-Foren und -Nachrichten verfolgt haben, haben Sie sicherlich von Full-Site-Editing (FSE) gehört oder zumindest Hinweise darauf gesehen, wie z. B. die Erstellung von Blockthemen. Auch wenn Sie nicht wissen, was es ist, haben Sie wahrscheinlich schon davon gehört und sich vielleicht sogar gefragt, was es für Sie bedeuten könnte.

Egal, ob Sie WordPress häufig verwenden oder ein Entwickler sind, es gibt hervorragende Neuigkeiten für Sie. Der eigentliche Kicker ist, dass Sie keine Angst davor haben sollten und dass alles für Sie gut ausgehen wird, was den Prozess für Sie erleichtert.

Auf welcher Grundlage behaupten wir das? Zuerst kommt zuerst. Lassen Sie uns zunächst ein wenig über die vollständige Bearbeitung von WordPress-Sites verstehen, bevor wir uns direkt mit dem befassen, was wir im Titel behandelt haben.

WordPress Full-Site Editing (FSE) ist …?

Im Wesentlichen vermeidet die vollständige Site-Bearbeitung die Idee von Blöcken. Bisher konnten Blöcke verwendet werden, um den Inhaltsbereich der Website zu bearbeiten. Jeder Abschnitt Ihrer Website wird jetzt als Block betrachtet, wenn Sie die vollständige Website-Bearbeitung verwenden.

Dank dieser erheblichen Verbesserung können Benutzer jetzt sowohl mit der Seite als auch mit den globalen Elementen auf einer einzigen Plattform interagieren. Darüber hinaus wurden neue Designkonfigurationsdateien und Entwicklungstools hinzugefügt.

Nachdem Sie WordPress auf die neueste Version aktualisiert haben, müssen Sie ein FSE-Design wie Twenty Twenty-Two aktivieren. Danach können Sie nur die Gutenberg-Blöcke verwenden, um eine ganze Website zu erstellen.

Wie kann FSE Ihnen helfen?

Dank der vollständigen Seitenbearbeitung ist das Erstellen und Entwickeln einer WordPress-Website jetzt einfacher als je zuvor. Die globalen Elemente und alle Seitenaktualisierungen können beide mit demselben Editor vorgenommen werden.

Und was sind globale Elemente? Wenn zugewiesen, können globale Elemente, Container und Spalten auf Ihrer gesamten Website verwendet werden.

Diese innovative Technik ermöglicht es Ihnen, die Webseite oder jede bestimmte Seite zu bearbeiten, was Zeit spart. Sie müssen nicht zwischen den Editoren wechseln, um herauszufinden, was passiert, da Sie sie alle in Echtzeit sehen können, während Sie bearbeiten. Das Ergebnis? Ihr Website-Design verbessert sich, wenn Sie gleichzeitig auf Seiten- und globaler Ebene arbeiten.

In der Version WordPress 6.0 ist FSE standardmäßig nicht aktiviert. Um die vollständige Website-Bearbeitungsfunktion zu nutzen, während Sie eine ältere WordPress-Edition als 6.0 verwenden, müssen Sie daher zuerst WordPress aktualisieren, bevor Sie ein FSE-Design aktivieren. Das Dashboard Ihrer Website ist der Ort, an dem Sie all das erledigen.

Die WordPress-Umgebung entwickelt sich erneut weiter

Diese Art von Änderung in WordPress ist in der vorherigen Periode aufgetreten. Wir alle kannten Gutenberg vor ungefähr drei Jahren (es ist schwer, sich daran zu erinnern, da eines, wenn nicht mehrere dieser letzten Jahre abrupt verschwanden). Sie können es jetzt als Blockeditor bezeichnen.

Als es jedoch ursprünglich in den WordPress-Kern integriert wurde, erhielt es den Codenamen Gutenberg. Veränderung ist schwierig. Daher reagierten die meisten Leute mit einem Ausraster. Nun, fast alle. Gutenberg wird heute, einige Jahre später, als einigermaßen hilfreich, häufig angenehm zu bedienen und sich kontinuierlich weiterentwickelnd empfunden. Aus diesem Grund sind wir zuversichtlich, dass diese Umstellung erfolgreich sein wird. Aber die Veränderung ist bedeutsamer als zuvor.

Fokusverschiebung: Von Benutzern zu Entwicklern

Als ein solcher Blockeditor zum ersten Mal eingeführt wurde, änderten die Entwickler die Art und Weise, wie sie Material produzierten. Für diejenigen, die Blog-Posts erstellten, war es nicht so störend wie für diejenigen, die Websites erstellten und Webseiten entwickelten. Die Umstellung auf Blöcke war für die Benutzer von Vorteil, und viele aufregende Funktionen folgten, wie z. B. die Möglichkeit, einen Materialblock zu definieren und ihn dann dynamisch überall (und überall) auf der Website zu platzieren. Jeder kann dies jetzt tun, ohne Code zu verwenden.

Aber diese Änderung ist ein wenig ausgeprägt. Es ist nicht nur die Art und Weise, wie Sie Ihre Website ändern, die sich mit der vollständigen Website-Bearbeitung geändert hat. Es hat mit dem Grundgerüst Ihrer Website zu tun. Hier wird nicht nur Ihre Kopf- oder Fußzeile definiert. Es betrifft die Komponenten eines Themas. Mit anderen Worten, FSE soll letztendlich den Benutzern zugute kommen, aber im Moment fühlt es sich eher wie ein Schwerpunkt auf der Verbesserung der Dinge für Builder an – sowohl für diejenigen, die Webseiten erstellen, als auch für diejenigen, die Themen erstellen.

Egal, ob Sie Seitenersteller verwendet haben, dh das Projekt abgeschlossen haben, eine Website mit einer benutzerfreundlichen Plattform unter den besten Website-Erstellern für Mitglieder zu starten, oder sie selbst erstellt haben, viele von Ihnen haben sich an diese Lebensphase gewöhnt. Ihre Seiten können beliebig gestaltet werden. Später werden Sie jedoch auf Leistungsprobleme aufmerksam. Google hat Ihr Ranking reduziert und festgestellt, dass Ihr DOM zu massiv war (was auch immer das war). Da wir uns alle bewusst sind, dass Leistung das A und O ist, ist jetzt der perfekte Zeitpunkt, um mehr über FSE und darüber zu erfahren, wie es die von Ihnen erstellten Websites verändern kann.

Warum ist es dann wichtig, ein Full-Site-Theme zu erstellen?

Beaver Builder kam vor Elementor, erinnerst du dich? Viele von Ihnen haben es selbst oder in den Unternehmen, in denen Sie gearbeitet haben, verwendet, um umfangreiche Websites für Geschäftskunden zu erstellen. Sie benötigten jedoch ein anderes Produkt, Beaver Themer. Andernfalls mussten Sie ihnen mit einem Design helfen, das benutzerdefinierte (und dynamische) Kopf- und Fußzeilen unterstützte, wenn sie die Kopf- und Fußzeile von Webseiten (oder Beiträgen) ändern mussten.

Es war aufregend, als Themen wie Blocksy, Kadence und Astra begannen, diese Funktionen zu entwickeln. Aber es führte auch zu einem gewissen Lock-in. Und Sie erkennen, was als nächstes passiert: Nachdem ein Kunde ein Plugin auf seiner Website installiert hat, stellt er fest, dass es nicht mit dem Theme oder dem Page Builder kompatibel ist.

Plötzlich zeigen alle mit dem Finger. Die Themenfirmen behaupten, dass sie es nicht sind. Laut Seitenerstellern sind sie es auch nicht. Erraten Sie, was? Neue Spieler im Spiel, die Hosting-Unternehmen, behaupten, dass sie es nicht sind. Die Bauherren (Bauunternehmer und Agenturen), die das Gelände ursprünglich gebaut hatten, wurden letztendlich beschuldigt.

Dasselbe geschah, als sich Benutzer darüber beschwerten, wie langsam diese Seiten geladen wurden, dank des Codes, den dieselben Seitenersteller generiert hatten. Agenturen und Freiberufler wurden kritisiert.

Lösung

Diese Änderung der Blockdesigns, die eine vollständige Anpassung der Website unterstützen, stellt eine grundlegende Änderung in der Art und Weise dar, wie Websites erstellt werden. Mit dieser Änderung ist jedes Element auf der Seite und auf der gesamten Website ein Block: Inhalt, Menüs, Seitenleisten, Kopf- und Fußzeilen. Jeder Block. Dadurch können Themes leichter ausfallen.

Das Theme muss noch einige Aufgaben erledigen, etwa das universelle Styling für Blöcke auf der gesamten Seite vereinheitlichen oder Tippfehler beheben. Entwickler können alles in der neuen Datei themes.json konfigurieren. Es dient aber nicht nur der Parametrierung. Es ist auch eine Möglichkeit für einen Entwickler, die Art und Weise zu ändern, wie ein Kunde den Editor verwendet.

Außerdem gibt es in den Themes nicht viele UI-Elemente. Es ist leicht vorstellbar, dass die nächste Iteration dessen, woran Sie gewöhnt sind – die Verwendung des benutzerdefinierten Builders – vom JSON-Konfigurator in seiner heutigen Form gesteuert wird.

Kurz gesagt, dies ist die zukünftige Generation von Themen und die Mittel, mit denen Sie schließlich einschränken können, was Benutzer mit solchen neuen Themen erreichen können.

Wie kann man dem Ganzen einen logischen Sinn geben?

Auch wenn es aufregend erscheint, die größere Schwierigkeit besteht darin, zu bestimmen, wie Sie alle dies lösen werden. Niemand will ein neuartiges Konzept entwickeln, das sich als ganz einfach herausstellt. Niemand möchte ein brandneues Thema entwickeln, das die Benutzer irritiert.

Sie wollen den Komfort des „Bewährten und Wahren“ mit der Stärke des „Neuen“. Und es gibt mehr Fragen als Lösungen…

Sie sehen sich einen Entwicklerkurs zum Integrieren und Erstellen von Blockdesigns an

Stellen Sie sich vor, Sie belegen einen Kurs, in dem alles erklärt wird, was Sie im Detail über Bausteindesigns und FSE verstehen müssen. Wir beziehen uns neben anderen auf die folgenden 14 Punkte:

• Erfahren Sie mehr über die vollständige Website-Bearbeitung, um zu sehen, wie sie sich auf die Designentwicklung auswirkt.
• Erstellen Sie die einfache Indexvorlage und verwenden Sie dann Blöcke, um Beiträge aus der Datenbank abzurufen.
• Implementieren Sie eine ganze Blog-Startseite, ohne eine einzige Zeile zu codieren.
• Kopf- und Fußzeilen für das Thema sollten hinzugefügt werden.
• Verstehe, wie die vollständige Site-Bearbeitung mit Navigationsmenüs umgeht.
• Erfahren Sie, wie Sie die Einstellungen des Blockeditors mithilfe der Datei theme.json vorab anordnen.
• Entdecken Sie, wie Sie die integrierten Mustersteuerelemente verwenden, um vielseitige Layouts zu erstellen.
• Wenden Sie mithilfe von theme.json die universelle Typografie und die Farbschemata an.
• Verwalten Sie Auffüllung und Ränder mithilfe der Abstandssteuerelemente.
• Erfahren Sie, wie Sie den Blockeditor so einrichten, dass seine Einstellungen mit dem Thema übereinstimmen.
• Fügen Sie Schriftauswahl, Verläufe, Farbpaletten und andere Anpassbarkeitsoptionen hinzu.
• Um zu begrenzen, wie weit Ihre Clients vom Grunddesign abweichen können, erfahren Sie, wie Sie unerwünschte Anpassungsoptionen aus Blöcken eliminieren.
• Erfahren Sie, wie Sie Muster verwenden, um Ihnen und Ihren Kunden dabei zu helfen, Seiten schneller zu erstellen.
• Verwenden Sie Vorlagenelemente, um zu verhindern, dass Blockkomponenten erneut in verschiedenen Vorlagen verwendet werden.

Das ist eine beeindruckende Liste von Lektionen, die es zu lernen gilt. Und die gute Nachricht: Bei der Ausbildung geht es nicht nur um die Wissensvermittlung. Sie werden ermutigt, sich in diesem Training Ihre Finger und Nägel schmutzig zu machen. Übung macht es perfekt.

Und hey, Sie müssen sich das nicht vorstellen, was eine wunderbare Nachricht ist. Das Programm ist erstellt. Es ist alles eingestellt. Obwohl es nicht das beabsichtigte Thema des Beitrags war, werden wir es dennoch offenlegen, da wir beim Sammeln von Informationen für den Artikel darauf gestoßen sind. Frank Klein, ein bei WordPress-Profis bekannter und angesehener Entwickler, hat den Kurs erstellt.

Also, Jungs, viel Glück beim Erstellen von Blockthemen und beim FSE!