Wenn Sie WordPress 5.0 und höher verwenden, haben Sie, sofern Sie nicht unter einem Felsen gelebt haben, zweifellos von dem Gutenberg - Update gehört, das im Dezember 2018 in ^{(December 2018)}WordPress integriert wurde .

Wenn Sie also die neueste Version von WP verwenden, verwenden Sie entweder bereits Gutenberg oder haben den klassischen Editor weiterhin verwendet, indem Sie das WordPress Classic Editor-Plugin installiert haben .

Warum Gutenberg?^{(Why Gutenberg?)}

Viele WP-Benutzer sind nicht bereit, auf den Gutenberg-Wagen^{(on the Gutenberg wagon)} aufzuspringen , aber einige sind es, einschließlich dieser Website.

Einige der Gründe, warum Sie Gutenberg verwenden möchten, sind, weil es:

• Ist die Zukunft für WP-Entwickler.
• Bietet eine bessere Benutzererfahrung.
• Ist flexibler als der ursprüngliche Editor von WP ( TinyMCE ).
• Bietet einen neuen Markt für Entwickler.

Was sind die Unterschiede zwischen WordPress und Gutenberg?^{(What Are The Differences Between WordPress & Gutenberg?)}

Der Classic Editor^{(Classic Editor)} von WP ist ein Texteditor und sieht Microsoft Word sehr ähnlich . Es hat ein einzelnes Bearbeitungsfeld, wie im Screenshot unten zu sehen ist.

Gutenberg ist ein blockbasierter Editor, der so aussieht:

Es gibt mehrere Blöcke für verschiedene Arten von Inhalten, die ihre eigenen Formatierungsoptionen enthalten. Blöcke wie:

• Taste
• Bild
• Tisch
• Einbettungen
• Aufführen
• Galerie
• Audio
• Zitate
• Üerschrift
• Code
• Vers
• Benutzerdefiniertes HTML

Außerdem bieten Themen und Plugins mehr Blöcke und Widgets, die Sie in Ihren WP-Beiträgen und -Seiten verwenden können.

Wie sind bestehende Seiten oder Beiträge betroffen?^{(How Are Existing Pages Or Posts Affected?)}

Nach dem Upgrade und der Verwendung von Gutenberg sollten Ihre vorhandenen Seiten und Beiträge weiterhin korrekt angezeigt werden. 

Sie sollten jedoch Ihre Shortcodes überprüfen und sicherstellen, dass die von Ihnen möglicherweise verwendeten Plugins funktionieren.

Wenn du eine bestehende Seite oder einen Beitrag bearbeitest, wird er/sie automatisch in einem einzigen neuen klassischen Block des Gutenberg -Editors geöffnet.

Sind Sie bereit für den Wechsel?

Verwenden Sie eine Staging-Site^{(Use a Staging Site)}

Das Letzte, was Sie tun möchten, ist, Ihre bestehende Website zu beschädigen. Um dies zu vermeiden, aktivieren Sie Gutenberg auf einer Staging-Site^{(a staging site)} . Dies ist eine exakte Nachbildung Ihrer Website, auf der Sie Dinge testen können, ohne Ihre Live-Website zu beschädigen.

Testseiten umfassen Ihr Design, Plugins , Optionen und Inhalte. Ihr Hosting-Unternehmen bietet möglicherweise Staging-Sites an. Wenn dies nicht der Fall ist, können Sie das WordPress Staging-Plugin verwenden .

Nachdem Ihre Staging-Site betriebsbereit ist, installieren und aktivieren Sie das Gutenberg-Plugin und beginnen Sie mit dem Testen. Oder installieren Sie eine brandneue Instanz von WordPress auf Ihrem Computer und testen Sie dort.

Überprüfen Sie Ihre Plugins^{(Check Your Plugins)}

WordPress-Benutzer sind damit vertraut, was passiert, wenn Plugins nicht gut zusammenspielen. Manchmal liegt es an der Funktionalität oder an widersprüchlichem Code. Dies ist ein ausgezeichneter Zeitpunkt, um zu sehen, ob Sie alle Plugins verwenden, die Sie installiert haben. Wenn nicht, entfernen Sie sie.

Sie möchten auch sehen, welche Plugins verwendet werden, wenn Sie Inhalte in WordPress bearbeiten . Bestimmte Plugins wie Akismet , Contact Form 7 , Google Sitemap Generator und WP Super Cache haben nichts mit dem Editor zu tun und werden durch die Verwendung von Gutenberg nicht beeinträchtigt .

Andererseits ist jedes Plugin, das Funktionen hinzufügt oder das Aussehen des klassischen WP-Editors ändert, möglicherweise nicht mit Gutenberg kompatibel . Insbesondere Plugins, die Shortcodes generiert haben, benutzerdefinierte Stile hinzufügen oder in letzter Zeit nicht aktualisiert wurden, führen normalerweise zu Konflikten und verursachen Probleme.

Gutenberg hatte früher eine aktive Plugin-Kompatibilitätsdatenbank^{(Plugin Compatibility)} . Es wurde jedoch heruntergefahren, da es nicht mehr aktiv gewartet wird.

Sie können die endgültigen Daten überprüfen und die Datenbank^{( download the database)} als CSV -Datei herunterladen. Ohne Zugriff auf eine aktive Plugin-Kompatibilitätsdatenbank müssen Sie jedes Plugin, das Sie verwenden, manuell testen.

Versuchen Sie, einen neuen Beitrag auf Ihrer Testseite zu erstellen. Sie werden sehen, dass Sie sich im Gutenberg- Editor befinden und dieser für Sie anders aussehen wird. Wenn Sie mit der Eingabe beginnen, erstellen Sie automatisch einen Absatzblock. Sie müssen keinen neuen Block hinzufügen, wenn Sie einen neuen Absatz hinzufügen. Drücken Sie einfach^(Just) die Eingabetaste oder die Eingabetaste.

Da Sie versuchen zu sehen, ob Ihre aktuellen Plugins funktionieren, versuchen Sie nachzubilden, wie Sie jedes verwendet haben, und sehen Sie, ob es noch funktioniert.

Wenn dies nicht der Fall ist, suchen Sie im standardmäßigen Gutenberg -Block nach derselben Funktionalität, fügen Sie diesen Block hinzu und fügen Sie Ihren Inhalt hinzu.

Stellen Sie sicher, dass Sie eine Liste der Plugins führen, die nicht richtig funktionieren, damit Sie sie entfernen können, wenn Sie mit Gutenberg live gehen .

Was ist, wenn es keinen Standardblock für die von Ihnen benötigte Funktionalität gibt?^{(What If There Is No Default Block For The Functionality You Need?)}

Überprüfen Sie alle Blöcke, um zu sehen, ob sich die benötigte Funktionalität in einem anderen Block befindet. Wenn Sie etwas nicht finden können, das funktioniert, können Sie sich an die Plugin-Autoren wenden und sie fragen, ob sie planen, es zu aktualisieren, damit es mit Gutenberg kompatibel ist .

Wenn alles andere fehlschlägt, versuchen Sie, ein Gutenberg-Plugin zu finden , das das tut, was Sie brauchen. Löschen Sie die Plugins, die nicht funktionieren, von Ihrer Staging-Site.

Live gehen^{(Going Live)}

Bevor Sie irgendetwas an Ihrer Live-Site unternehmen, erstellen Sie eine vollständige Sicherung Ihrer gesamten Site, falls Sie bei der Kompatibilitätsprüfung etwas übersehen haben oder ein anderer Fehler auftritt.

Es ist möglich, alle notwendigen Änderungen auf Ihrer Test-Site vorzunehmen und sie auf Ihre Live-Site zu übertragen. Dies erfordert jedoch einige technische Kenntnisse. Wenn Sie also kein Entwickler sind oder einen haben, der für Sie funktioniert, ist es besser, die Änderungen manuell vorzunehmen.  

Löschen Sie zunächst die Plugins, die nicht funktionierten, und fügen Sie die neuen hinzu, die Sie gefunden haben, um sie zu ersetzen. Wenn alte Plugins Daten für bestehende Posts und Seiten verarbeiten und neue nicht beschädigen, können Sie sie installiert lassen.

Möchten Sie Ihre alten Beiträge und Seiten in Gutenberg-Blöcke umwandeln?^{(Do You Want To Convert Your Old Posts & Pages To Gutenberg Blocks?)}

Öffnen Sie jede Seite und posten Sie über das klassische Blockmenü^{(Block Menu)} . Klicken Sie^(Click) auf die drei Punkte, um die Optionen anzuzeigen^{(view options)} . Wählen Sie aus dem Dropdown-Menü In Blöcke konvertieren^{(Convert to Blocks)} .

Nachdem WP Ihre Inhalte in das Gutenberg -Blocksystem konvertiert hat, sollten Sie jeden Block überprüfen. Verwenden Sie die Blocknavigation^{(Use Block Navigation)} (über Symbole), um alle Teile Ihres Beitrags oder Ihrer Seite anzuzeigen.

Wie Sie im obigen Screenshot sehen können, befindet sich jetzt jeder Absatz, jedes Bild, jede Liste und jede Überschrift in einem eigenen Block. Das Konvertieren bestehender Seiten und Beiträge in das neue Gutenberg -System ist schnell und einfach.

Es kann mehrere Stunden dauern, Ihre Plugins zu testen und neue zu finden, aber Sie müssen dies nur einmal tun. Stellen Sie sicher, dass Sie die oben vorgeschlagenen Schritte befolgen, um Ihren Wechsel zu Gutenberg schmerz- und fehlerfrei zu gestalten.

How To Transition From The Classic WordPress Editor To Gutenberg

If you use WordРress 5.0 and higher, unless уou have been living under a rock, you will have undoubtedly heard of the Gutenberg update which was merged іnto WordPress in December 2018.

So if you are using the latest version of WP, you are either already using Gutenberg or have continued using the classic editor by installing the WordPress Classic Editor plugin.

Why Gutenberg?

Many WP users are not ready to jump on the Gutenberg wagon, but some are, including this website.

A few of the reasons why you might want to use Gutenberg are because it:

• Is the future for WP developers.
• Provides a better user experience.
• Is more flexible that WP’s original editor (TinyMCE).
• Will provide a new market for developers.

What Are The Differences Between WordPress & Gutenberg?

WP’s Classic Editor is a text editor and looks very much like Microsoft Word. It has a single editing field as seen in the screenshot below.

Gutenberg is a block-based editor that looks like this:

There are multiple blocks for different types of content that include their own formatting options. Blocks such as:

• Button
• Image
• Table
• Embeds
• List
• Gallery
• Audio
• Quotes
• Heading
• Code
• Verse
• Custom HTML

Also, themes and plugins offer more blocks and widgets for you to use in your WP posts and pages.

How Are Existing Pages Or Posts Affected?

After upgrading and using Gutenberg, your existing pages and posts should continue to display correctly. 

However, you should check your shortcodes and make sure that the plugins you might be using are working.

When you edit an existing page or post, it will automatically open in a single new Gutenberg editor classic block.

Are you ready to make the switch?

Use a Staging Site

The last thing you want to do is break your existing site. The way to avoid this is to activate Gutenberg on a staging site. This is an exact replica of your website where you can test things out without doing any damage to your live site.

Test sites include your theme, plugins, options, and content. Your hosting company might offer staging sites. If they don’t, you can use the WordPress Staging plugin.

After your staging site is up and running, install and activate the Gutenberg plugin and start testing. Or install a brand new instance of WordPress on your computer and test on there.

Check Your Plugins

WordPress users are familiar with what happens when plugins don’t play nice together. Sometimes it’s due to the functionality or conflicting code. This is an excellent time to see if you are using all the plugins you have installed. If you aren’t, remove them.

You also want to see which plugins are being used when you are editing content in WordPress. Specific plugins such as Akismet, Contact Form 7, Google Sitemap Generator, and WP Super Cache have nothing to do with the editor and will not be affected by using Gutenberg.

On the other hand, any plugin that adds functionality or changes the way the WP classic editor looks might not be compatible with Gutenberg. In particular, plugins that generated shortcodes, adds custom styles, or haven’t been updated recently, usually conflict and cause problems.

Gutenberg used to have an active Plugin Compatibility database. However, it has been shut down because it is no longer actively maintained.

You can review the final data and download the database as a CSV file. Without access to an active plugin compatibility database, you are going to have to manually test each plugin you use.

Try creating a new post on your test site. You will see that you are in the Gutenberg editor and it will look different to you. When you start typing, you are automatically creating a paragraph block. You don’t have to add a new block when you add a new paragraph. Just hit enter or the return key.

Since you are trying to see if your current plugins will work, try to recreate how you used each one and see if it still works.

If it doesn’t, look for the same functionality in the default Gutenberg block, add that block, and add your content.

Be sure to keep a list of the plugins that don’t work correctly so you can remove them when going live with Gutenberg.

What If There Is No Default Block For The Functionality You Need?

Check all the blocks to see if the functionality you need lives inside another block. If you can’t find something that will work, you can contact the plugin authors and ask them if they are planning to update it to be compatible with Gutenberg.

If all else fails, try to find a Gutenberg plugin that does what you need. Delete the plugins that don’t work from your staging site.

Going Live

Before you do ANYTHING to your live site, make a complete backup of your entire site in case you missed something when checking for compatibility or another error occurs.

It is possible to make all the necessary changes on your test site and push them to your live site. However, this requires some technical knowledge. So, unless you are a developer or have one that works for you, it is better to make the changes manually.  

Start by deleting the plugins that didn’t work and adding the new ones you found to replace them. If old plugins are processing data for existing posts and pages and do not break new ones, you can leave them installed.

Do You Want To Convert Your Old Posts & Pages To Gutenberg Blocks?

Open each page and post from the Classic Block Menu. Click the three dots to view options. Select from the drop-down menu Convert to Blocks.

After WP converts your content to the Gutenberg block system, you should review each block. Use Block Navigation (from icons) to see all the parts of your post or page.

As you can see in the above screenshot, every paragraph, image, list, and heading is now in its own block. Converting existing pages and posts to the new Gutenberg system is quick and easy.

It might take several hours to test your plugins and find new ones, but you only have to do this once. Make sure to follow the steps suggested above to make your move to Gutenberg painless and error-free.

Related posts

• WordPress Gutenberg-Tutorial: So verwenden Sie den neuen Editor

• So verschieben Sie eine WordPress-Site von einem Host auf einen anderen

• So installieren und konfigurieren Sie WordPress auf Microsoft Azure

• So führen Sie blitzschnelles WordPress auf Microsoft Azure aus

• So konfigurieren Sie den Datenschutz in WordPress und warum es wichtig ist

• 10 wichtige WordPress-Plugins für eine Website für kleine Unternehmen

• So sichern Sie Ihre WordPress-Site

• So verwenden Sie Lumen5, um Ihren Blog-Beitrag in ein Video umzuwandeln

• So finden Sie Ihr WordPress-Admin-Login

• WordPress Jetpack: Was ist das und lohnt es sich zu installieren?

• Muss WordPress Yoast SEO-Einstellungen 2022 haben

• So installieren Sie eine WordPress-Testseite auf Ihrem Computer

• Child-Theme in WordPress erstellen

• Squarespace Vs WordPress: Welches ist die bessere Site-Plattform?

• So schützen Sie Seiten auf Ihrer WordPress-Website mit einem Passwort

• So installieren Sie ein Theme auf WordPress

• Wix Vs WordPress: Was ist am besten für die Erstellung Ihrer Website?

• Was ist AMP für WordPress und wie wird es installiert?

• So steigern Sie die Leistung in WordPress durch eine Datenbankbereinigung

• Buchbesprechung: Erstellen Sie Ihre eigene Website: Ein Comic-Leitfaden für HTML, CSS und Wordpress