Modern WordPress Plugins with the Gutenberg Migration Guide

Core points

• The Gutenberg Migration Guide written by Daniel Bachhuber is a must-have resource for developers to help them tweak WordPress themes and plugins to make them compatible with the new Gutenberg editor. It compares custom points between classic editor and Gutenberg and covers all affected hooks and classic editor features.
• Despite the increasing capabilities of Gutenberg and the benefits of end users and developers, many WordPress developers are still slow to adapt to their products. However, with Gutenberg becoming the new default editor for WordPress, it is crucial to ensure themes and plugins are compatible with them.
• The Gutenberg Migration Guide is well-layouted and easy to use, and provides practical examples of how to use hooks, screenshots of equivalent hooks in Gutenberg, and references to the Gutenberg developer manual. However, it still requires more contributions from the WordPress community to reach its full potential.

This article about Gutenberg's migration guide was originally published by Torque Magazine and is reproduced here with permission.

Like it or not, Gutenberg has become a part of WordPress. So getting your WordPress themes and plugins to work with a new editor should be a top priority. To be honest, if you're only starting to think about this now, you've missed a lot of time. However, there is still enough time to prepare your product, especially with the help of some third-party help.

Daniel Bachhuber’s Gutenberg-related projects have been published on the Torque blog before, and it’s also a project worth watching. Tweaking your plugin to make it compatible with Gutenberg can be a tricky task, but the Gutenberg migration guide should help you with the switch. This is a handy reference guide for comparing custom points between the WordPress classic editor and Gutenberg.

In this article, we will learn about the project as a whole and discuss how it works. We will then discuss how to make sure your plugins and themes are ready to use Gutenberg. Let's get started!

The current status of Gutenberg editor

We have discussed Gutenberg's history many times on the Torque blog, so we won't go into details here. However, to provide some background information, Gutenberg will eventually become the new default editor for WordPress. It will replace the currently used version of TinyMCE. While Gutenberg is no longer a beta version, we are still waiting for the plugin to be merged into the core platform.

However, while there are good reasons behind Gutenberg's functionality, many people are upset with the editor's current lack of perfection. This evaluation may be a bit harsh considering the current status of the project. In any case, high criticism has led to a lack of action by many WordPress developers, especially in getting their products to standards.

However, this has not stopped some savvy developers from trying to capture the market for early adopters. For example, the very popular Elementor Pro page builder now contains many "blocks" that are compatible with Gutenberg. Other developers have also begun to use this feature as a standard feature:

The fact that we ended up seeing Gutenberg-related features appear in business topics should make the situation clearer. In other words, some developers have been working on their Gutenberg solution for a while. Now, they are starting to provide these solutions to the public.

If you haven't started doing this yet, you may need some help to get started. Fortunately, there is a great initiative that can help this way.

Introduction Gutenberg Migration Guide

Getting some support while migrating your features to Gutenberg may be welcomed by many developers. To this end, Daniel Bachhuber (which has recently become the focus of Gutenberg-related initiatives) has created the Gutenberg migration guide.

This is a resource that helps developers port their TinyMCE-centric plugins and themes to a new editor. It contains a large number of screenshots and a convenient reference to the Gutenberg developer manual. You can think of it as Gutenberg's own "Codex", although it is not classified as the official part of WordPress Codex.

This guide also includes a brief overview listing each TinyMCE editor custom point and its Gutenberg equivalent. Additionally, it covers all affected hooks and classic editor features. This will obviously be an important reference resource when you try to find solutions that port functionality to Gutenberg.

How to help Gutenberg migration project succeed

As outlined in the Make WordPress blog post at the end of April, Daniel is seeking to crowdsource the project, rather than staying the sole contributor. However, despite the numerous components that make up the new editor, there is little additional contribution:

Therefore, especially given the high value of the project, more contributors are needed to help refine this guide. To start contributing, you can send a pull request as usual, then approve and merge it into the guide. You can also suggest new hooks (or ask questions) by opening GitHub questions.

How to use Gutenberg Migration Guide to Deliver Modern WordPress Plugins

The actual use of Gutenberg migration guide is very simple, mainly because its layout is organized:

You will find a reference to the relevant TinyMCE editor action or filter at the top of each page, followed by a common example of its use in WordPress. Next, you will find a practical example of how to use the hook. This is an area where the project needs to contribute more. Many plugins add their own features to the editor, which need to be documented.

Below you will find a screenshot of the equivalent hook in Gutenberg. This will come with a brief description of where you can find the hook, and any esoteric information about its use. Finally, there is a handy Gutenberg developer manual reference that can help you if you need more information.

Overall, this is a very useful Gutenberg developer reference guide that should be bookmarked during the migration process. In our opinion, the parts you should look at first are those that have not switched to Gutenberg. For example, many edit_form operations are no longer compatible in Gutenberg. Depending on the functionality of your theme or plugin, this may require a comprehensive workaround.

Lastly, two classic editor features that have not been merged into Gutenberg are the Screen Options tab and the unofficial custom post status feature. The former may worry many developers more, as this is a "powerful" feature that many WordPress users find useful.

It is crucial to make sure your theme and plugins can adapt to both editors. As you can see, the Gutenberg Migration Guide will help you achieve this.

Conclusion

Gutenberg has its critics, but every beta update brings more. New editors are slowly becoming a powerful way to create WordPress layouts, which is good news for both end users and developers.

In addition, Daniel Bachhuber’s Gutenberg migration guide is an excellent resource for those who need to quickly adjust their projects. It’s very easy to use in itself, but it still needs the help of the WordPress community to reach its full potential. To help, you can send pull requests, open GitHub issues, and even provide a practical example of the Gutenberg equivalent of your own TinyMCE editor feature.

FAQs about modern WordPress plugins using Gutenberg Migration Guide

What is Gutenberg in WordPress?

Gutenberg is a new editor introduced in WordPress 5.0. It replaces the previous TinyMCE editor and provides a more intuitive, block-based method of content creation. Each piece of content, whether it is a paragraph, image or video, is a block that you can operate separately, providing greater flexibility and control over the layout of the content.

How to migrate to Gutenberg?

Migrating to Gutenberg includes installing and activating the Gutenberg plug-in or updating to WordPress 5.0 or later. When activated, Gutenberg will replace the default editor. It is recommended to back up your website before making a switch and first test the new editor on the staging site.

What is a Gutenberg block?

Gutenberg blocks are the elements you use to build content in the Gutenberg editor. There are blocks of various types of content, including paragraphs, images, videos, columns, and so on. Each block can be customized and arranged to create a unique layout.

How to add new blocks to Gutenberg?

You can add new blocks to Gutenberg by clicking the plus sign ( ) icon in the editor. This will open a menu where you can search and select the type of block you want to add. There are also some plugins that can add additional blocks to Gutenberg.

Can I still use my old plugin to be compatible with Gutenberg?

Yes, most existing WordPress plugins should be compatible with Gutenberg. However, some plugins may be incompatible and may cause problems. It is recommended to use Gutenberg to test all plugins on the staging site before using all plugins for your live site.

What are some recommended Gutenberg block plugins?

There are many great Gutenberg block plugins available. Some popular plugins include Advanced Gutenberg, Stackable, and Atomic Blocks. These plugins add various additional blocks to Gutenberg, giving you more content options.

How to customize Gutenberg blocks?

Gutenberg blocks can be customized using block settings in the editor. These settings allow you to change the appearance, layout, and other properties of the block. Some blocks also support additional customization via CSS.

If I don't like Gutenberg, can I restore to the old editor?

Yes, if you prefer older editors, you can install and activate the Classic Editor plugin. This will disable Gutenberg and restore the previous TinyMCE editor.

Is Gutenberg SEO friendly?

Yes, Gutenberg is designed to be SEO friendly. Block-based structure makes it easier to create clean, structured content and easier for search engines to understand. But, like anything, be sure to follow SEO best practices.

How to learn to use Gutenberg?

There are many resources to help you learn Gutenberg. WordPress provides tutorials in the Gutenberg editor, and there are many online tutorials and guides available. Practice and experimentation are also great ways to learn the ins and outs of new editors.

The above is the detailed content of Modern WordPress Plugins with the Gutenberg Migration Guide. For more information, please follow other related articles on the PHP Chinese website!