Alles, was Sie brauchen, um mit WordPress Gutenberg loszulegen

Im Jahr 2018 zielt WordPress darauf ab, die Inhaltserstellung mit Gutenberg zu modernisieren und zu vereinfachen. Sein Name stammt von Johannes Gutenberg, dem Begründer des Buchdrucks. Dies wird als eine der größten Änderungen für die WordPress-Benutzererfahrung und den Workflow der Themenentwicklung angesehen.

Was ist Gutenberg?

Die meisten von uns denken, dass Gutenberg nur ein neuer Redakteur ist, aber das ist nicht alles. Während der Editor derzeit im Mittelpunkt steht, wird sich das Projekt letztendlich auf das gesamte Publishing-Erlebnis einschließlich der Anpassung auswirken.

Bisher bedeutete das Bearbeiten einer Seite, dass der Titel, der Text und die benutzerdefinierten Felder angepasst werden mussten. Mit Gutenberg ändert sich diese Logik komplett und führt das Konzept der Blöcke ein . Blöcke sind eigenständige, isolierte und dynamische Komponenten der Benutzeroberfläche, die dynamisch über den wp-admin hinzugefügt werden. Ich werde darauf nicht näher eingehen, da das folgende Video alles im Detail erklärt.

Matt Mullenweg Gutenberg-Präsentation zur Lage der Welt 2017

Gutenberg ist bereits als Plugin verfügbar und wird in WordPress 5.0 integriert, das im April 2018 auf den Markt kommen soll. Das Team dahinter konzentriert sich derzeit auf die Post-Editing-Erfahrung. Aber von da an wird es ihren Ansatz erweitern, um die Erstellung von Vorlagen, die Erstellung von Websites und mehr einzuschließen. Um den Übergang zu Gutenberg reibungsloser zu gestalten, gibt es ein Plugin namens Classic Editor, mit dem Teams den aktuellen Editor verwenden können, während sie an ihren Migrationen arbeiten.

Warum ist Gutenberg gut für mich und was bedeutet das für die Zukunft von WordPress?

Gutenberg ist zweifellos eine große Veränderung und viele Entwickler werden sich daran anpassen müssen. Dies ist jedoch meiner Meinung nach eine der besten Änderungen, die WordPress je erlebt hat. Weil es den Theme-Entwicklungsprozess modernisiert und modularer mit einer saubereren Codebasis, besserer Wartung und Bearbeitung macht. Es bietet mehr Zuverlässigkeit und beseitigt seinen alten monolithischen hackbaren Ansatz.

Durch die Verwendung von Blöcken optimiert und vereinfacht es alle Arten, wie wir eine Seite erstellen (Shortcodes, Widgets, benutzerdefiniertes HTML, Medien, Textformatierung, Einbettungen und Metaboxen). Wie Matt in seinem Beitrag erklärt:

• Entwickler und Agenturen können interaktive Vorlagen erstellen, die Kunden einfach aktualisieren können, ohne Dinge zu beschädigen oder sich mit benutzerdefinierten Beitragstypen auseinanderzusetzen.
• Plugin-Entwickler können sich vollständig in jeden Teil von WordPress integrieren. Einschließlich Posts, Seiten, benutzerdefinierter Post-Typen und Seitenleisten, ohne TinyMCE hacken oder ihre gesamte Funktion hinter eine Schaltfläche in der Symbolleiste quetschen zu müssen.
• Theme-Entwickler müssen nicht Tonnen von Plugins bündeln oder ihre eigenen Seitenersteller erstellen. Es wird eine tragbare Standardmethode geben, um reichhaltige Layouts für Posts zu erstellen und die Benutzer direkt in der Benutzeroberfläche durch die Einrichtung zu führen. Keine 20-Schritte-Tutorials oder lange Videos erforderlich.
• Core-Entwickler können in modernen Technologien arbeiten und müssen sich keine Gedanken über 15 Jahre Abwärtskompatibilität machen.
• Benutzer werden endlich in der Lage sein, die Websites zu erstellen, die sie mit ihrer Fantasie erstellen. Sie werden in der Lage sein, Dinge auf dem Handy zu tun, die sie noch nie zuvor getan haben. Sie müssen nie wieder einen Shortcode sehen. Aus Word eingefügter Text wird automatisch und sofort bereinigt und in Blöcke umgewandelt.

Demos und Beispiele

In diesem Vortrag vom WordCamp US 2017 erklärt Morten, worauf sich WordPress-Entwickler konzentrieren müssen und wie WordPress mit Gutenberg transformiert wird.

Morten Rand-Hendriksen: Gutenberg und das WordPress von morgen

In diesem Screencast demonstriert Human Made eine Reihe fortgeschrittener Implementierungen von Gutenberg-Blöcken.

Wie man anfängt

Spielen Sie mit Frontenberg , einer eingeschränkten Frontend- Live-Demo des Gutenberg-Editors, die Ihnen hilft, sich mit der Gutenberg-Bearbeitungsumgebung vertraut zu machen.

Frontenberg – Ein ausgeloggter Gutenberg-Spielplatz zum sofortigen Testen

Lesen Sie den folgenden Artikel von Matias Ventura Bausero, einem der leitenden Ingenieure hinter Gutenberg .

Gutenberg oder das Schiff des Theseus – Wie kann sich ein System grundlegend weiterentwickeln, ohne sich drastisch zu verändern?

Spielen Sie mit diesen Sketch-Symbolen herum und versuchen Sie, Ihre eigenen benutzerdefinierten Blöcke zu entwerfen.

Automattic/gutenberg-themes-sketch – gutenberg-themes-sketch – Eine Reihe von Sketch-Dateien, die Ihnen beim Entwerfen blockgesteuerter WordPress-Themes helfen

Lesen Sie das offizielle Entwicklerhandbuch auf wordpress.org . Es ist sauber, leicht zu lesen und entwickelt sich ständig weiter. Sie sollten auch ihre Mailingliste abonnieren, um ihre Updates zu erhalten.

Einführung – „Gutenberg“ ist der Codename für den WordPress-Editor-Fokus 2017.

Tauchen Sie ein in ReactJS, da Gutenberg darauf aufbaut.

React – Eine JavaScript-Bibliothek zum Erstellen von Benutzeroberflächen – Eine JavaScript-Bibliothek zum Erstellen von Benutzeroberflächen

Sehen Sie sich diese Gutenberg-Beispiele an, die vom WordPress-Kernteam erstellt wurden.

WordPress/gutenberg-examples = gutenberg-examples – Beispiele zur Erweiterung von WordPress/Gutenberg mit Blöcken

Lesen Sie dieses ausführliche E-Book von Human Made (einer der besten WP-Entwicklungsagenturen) .

Gutenberg, der neue WordPress-Editor (White Paper) – Dieses White Paper behandelt die wichtigsten Herausforderungen bei der Implementierung und Einführung sowie Ratschläge, wie Unternehmen jetzt handeln können.

Sehen Sie sich diesen Entwicklungskurs von Zac Gordon an, Ausbilder auf einigen der beliebtesten Bildungsplattformen FrontendMasters, Treehouse und Udemy.

Der Gutenberg-Entwicklungskurs von Zac Gordon – Gutenberg-Kurse

Installieren Sie schließlich dieses konfigurationsfreie Entwickler-Toolkit zum Erstellen von WordPress Gutenberg-Block-Plugins von Ahmad Awais

ahmadawais/create-guten-block – Ein konfigurationsfreies #0CJS-Entwickler-Toolkit zum Erstellen von WordPress-Gutenberg-Blöcken.

Das ist alles für jetzt, vielen Dank für das Lesen dieses Beitrags und bitte hinterlassen Sie einen Kommentar, wenn Sie Gedanken, Fragen oder Vorschläge haben.

Wenn Sie eine Agentur, ein Unternehmen oder ein WordPress-Entwickler sind, der Ihre Website-Leistung, Sicherheit und Hosting-Erfahrung verbessern möchte, sprechen Sie mit unserem Engineering-Team. Unsere verwaltete WordPress-Hosting- Plattform gilt als eine der besten ihrer Branche mit unvergleichlicher Leistung, Zuverlässigkeit und technischem Kundensupport.

Unser Team hat es sich zur Aufgabe gemacht, die Art und Weise, wie WordPress-Entwickler ihre Websites erstellen, hosten und skalieren, neu zu definieren. Bleiben Sie also in Kontakt und sprechen Sie mit uns.