Sie können jetzt Ihr eigenes Blockdesign in WordPress erstellen

WordPress Full Site Editing (FSE) ermöglicht es uns, verschiedene Aspekte einer Website zu bearbeiten, ohne dass Code erforderlich ist. Es hat zuvor verborgene Teile eines Themas in die Reichweite von Nicht-Designern gebracht. Und dabei vielleicht die Arbeit eines Webprofis ein wenig erleichtert.

Aber das kratzt nur an der Oberfläche des Potenzials von FSE. Fortgeschrittenere Fähigkeiten werden entwickelt. Darunter ist die Möglichkeit, ein ganzes Block-Theme in WordPress zu erstellen.

Denken wir einen Moment darüber nach. In der Vergangenheit gab es zwei Hauptmethoden zur Implementierung von Themen. Die erste besteht darin, Ihre eigene von Grund auf mit PHP, HTML, JavaScript und CSS zu erstellen. Die andere besteht darin, ein Design eines Drittanbieters herunterzuladen und es nach Ihren Wünschen zu optimieren.

Dank des Plugins Create Block Theme gibt es jetzt eine dritte Methode: das Erstellen eines Block-Themes vollständig aus WordPress heraus. Von dort aus können Sie Ihre Kreation zur anderweitigen Verwendung exportieren.

Es klingt revolutionär in Bezug darauf, wie wir Websites mit WordPress erstellen. Wie funktioniert es? Heute werfen wir einen ersten Blick auf Create Block Theme und zeigen Ihnen, was es kann.

Was das Create Block Theme Plugin tut

Die Veröffentlichung des Plugins „Create Block Theme“ erfolgt zu einer Zeit, in der FSE noch eine im Entstehen begriffene Technologie ist. Es wurde von Mitgliedern des offiziellen WordPress-Theme-Teams entwickelt und könnte eines Tages seinen Weg in die Kernsoftware finden.

Auf den ersten Blick ist es eine sehr schnörkellose Software – aber das ist beabsichtigt. Das Plugin fügt dem Site-Editor keine radikal neuen Funktionen hinzu. Vielmehr bietet es eine Möglichkeit, die Arbeit, die Sie bereits erledigt haben, zu exportieren. Und es gibt noch ein paar andere Leckereien.

Wenn Sie Create Block Theme herunterladen und auf Ihrer Website aktivieren (es wird auch empfohlen, die neueste Version des Gutenberg-Plugins auszuführen), werden Sie einen neuen Menüpunkt bemerken, der sich unter Appearance > Create Block Theme befindet.

Dieser Bildschirm bietet Ihnen die folgenden Optionen:

Aktives Design exportieren
Wenn Sie bereits ein Blockdesign wie Twenty Twenty-Two verwenden und Änderungen im Website-Editor vorgenommen haben, können Sie die angepasste Version des Designs exportieren. Dies kann nützlich sein, wenn Sie einen benutzerdefinierten Ausgangspunkt für andere Projekte erstellen möchten, die das Design verwenden.

Untergeordnetes Element des aktiven Designs erstellen
In der Vergangenheit wurden untergeordnete Designs empfohlen, um sicherzustellen, dass Anpassungen nicht überschrieben werden, wenn Sie Updates für Ihr Design herunterladen. In Bezug auf Blockthemen kann ein untergeordnetes Element als Möglichkeit dienen, bestimmte Varianten des übergeordneten Elements zu verteilen. Beispielsweise kann eines ein anderes typografisches oder Farbschema enthalten.

Aktives Thema klonen
Diese Option kopiert Ihr aktives Design und fügt alle Änderungen, die Sie daran im Site-Editor vorgenommen haben, unter einem neuen Namen hinzu. Da es sich um eine separate Kopie handelt, können Sie am neuen Thema arbeiten, ohne das Original versehentlich zu beschädigen.

Aktives Thema überschreiben
Wenn Sie Änderungen am aktiven Design vorgenommen haben und möchten, dass die Standardeinstellungen überschrieben werden, können Sie dies mit dieser Option tun.

Erstellen eines benutzerdefinierten WordPress-Blockdesigns

Der Prozess zum Erstellen eines benutzerdefinierten WordPress-Blockdesigns umfasst das Vornehmen aller gewünschten Änderungen über den Website-Editor ( Darstellung > Editor ). Ändern Sie die Kopfzeile, Fußzeile, Inhaltsbereiche und alles andere, was Ihr Herz begehrt.

Aber bevor Sie das tun können, ist es wichtig, das richtige Blockthema auszuwählen. Zum Beispiel könnten Sie mit einer etwas leeren Leinwand wie Blockbase gehen. Auf diese Weise können Sie bei Null anfangen und einen vollständig individuellen Look erstellen. Es bedeutet auch, dass Sie keine vorhandenen Themenelemente abreißen müssen, die Sie nicht möchten.

Wenn Sie etwas mit mehr Passform und Finish bevorzugen, stehen mehrere Blockthemen zur Verfügung, die einen guten Ausgangspunkt bieten können. Sie haben ein etabliertes Layout und können alle notwendigen Anpassungen vornehmen, um sie an Ihre Bedürfnisse anzupassen.

Unabhängig davon, wie Sie beginnen, können Sie mit Create Block Theme Ihr Design zur Verwendung in einer anderen WordPress-Installation exportieren.

Exportieren Ihres benutzerdefinierten Blockdesigns

In diesem Beispiel habe ich einige grundlegende Anpassungen an Blockbase vorgenommen. Jetzt ist es an der Zeit, das Design zu exportieren und auf einer anderen lokalen WordPress-Website zu installieren.

Wie bereits erwähnt, bietet Create Block Theme mehrere Exportoptionen. Ich habe mich entschieden, ein untergeordnetes Thema zu erstellen und ihm einen benutzerdefinierten Namen zu geben. Das bedeutet, dass ich eine Kopie von Blockbase auf allen anderen Websites installieren muss, auf denen ich mein neues Child-Theme verwenden möchte.

Beim Exportieren wird eine ZIP-Datei generiert, die ich dann in meine neue Website importieren kann. Auf der neuen WordPress-Site navigiere ich zu Darstellung > Themen und klicke dann auf die Schaltfläche „ Neu hinzufügen “.

Sobald ich auf der Seite „ Designs hinzufügen“ bin, kann ich mein neues Blockdesign hochladen, indem ich auf die Schaltfläche „Design hochladen“ klicke und die exportierte .ZIP-Datei von meiner Festplatte auswähle. Abschließend aktiviere ich das Child-Theme.

Die Ergebnisse sehen gut aus. Die von mir vorgenommenen Änderungen haben den Exportvorgang überstanden und schienen auf der neuen Website gut zu funktionieren. Theoretisch wäre dies ein solider Vorsprung für die Arbeit an zukünftigen Projekten.

Ist das die Zukunft des Erstellens von WordPress-Themes?

Die Möglichkeit, ein Block-Theme aus WordPress heraus zu erstellen und es dann überall zu verwenden, könnte einen Wendepunkt für Ihren Workflow darstellen. Es erspart möglicherweise viel Zeit, die mit dem Umgang mit Code verbracht wird, und sorgt für ein vollständiges visuelles Designerlebnis.

Dennoch kann die Bequemlichkeit nicht viel bedeuten, wenn der Site-Editor nicht alle Tools bietet, die Sie benötigen. Es ist ziemlich einfach, verschiedene Layouts zu erstellen und Farben anzupassen usw. Aber es wird wahrscheinlich Szenarien geben, in denen Code erforderlich ist.

Es hängt alles davon ab, wie Sie gerne arbeiten. Einige von uns werden gerne an den bestehenden Prozessen festhalten – und das ist in Ordnung. Komfort und Stabilität sind wichtig – besonders wenn FSE- und Block-Themen noch in den Kinderschuhen stecken.

Die von Create Block Theme angebotene Portabilität ist jedoch ein Blick in die Zukunft. Und die Möglichkeit, WordPress-Blockthemen auf diese Weise zu erstellen, wird für viele Webdesigner attraktiv sein. Es ist eine Entwicklung, die es wert ist, im Auge behalten zu werden, während sie sich weiter entwickelt.