WordPress 5.0以降を使用している場合、岩の下に住んでいない限り、 2018年12月に(December 2018)WordPressに統合されたGutenbergのアップデートについて聞いたことがあるでしょう。
したがって、最新バージョンのWPを使用している場合は、すでにGutenbergを使用しているか、 (Gutenberg)WordPressClassicEditorプラグイン( WordPress Classic Editor plugin)をインストールしてクラシックエディターを引き続き使用しています。
なぜグーテンベルク?(Why Gutenberg?)
多くのWPユーザーはグーテンベルクワゴン(on the Gutenberg wagon)に飛び乗る準備ができていませんが、このウェブサイトを含めて、ジャンプする準備ができている人もいます。
グーテンベルク(Gutenberg)を使用する理由のいくつかは、次の理由によるものです。
- WP開発者の未来です。
- より良いユーザーエクスペリエンスを提供します。
- WPの元のエディター(TinyMCE)よりも柔軟性があります。
- 開発者に新しい市場を提供します。
WordPressとGutenbergの違いは何ですか?(What Are The Differences Between WordPress & Gutenberg?)
WPのクラシックエディタはテキストエディタであり、 (Classic Editor)MicrosoftWordに非常によく似ています。以下のスクリーンショットに示すように、単一の編集フィールドがあります。
グーテンベルク(Gutenberg)は、次のようなブロックベースのエディターです。
独自のフォーマットオプションを含む、さまざまなタイプのコンテンツ用の複数のブロックがあります。次のようなブロック:
- ボタン
- 画像
- テーブル
- 埋め込み
- リスト
- ギャラリー
- オーディオ
- 引用
- 見出し
- コード
- 詩
- カスタムHTML
また、テーマとプラグインは、WPの投稿とページで使用するためのより多くのブロックとウィジェットを提供します。
既存のページまたは投稿はどのように影響を受けますか?(How Are Existing Pages Or Posts Affected?)
グーテンベルク(Gutenberg)をアップグレードして使用した後も、既存のページと投稿は引き続き正しく表示されます。
ただし、ショートコードをチェックし、使用している可能性のあるプラグインが機能していることを確認する必要があります。
既存のページまたは投稿を編集すると、1つの新しいグーテンベルク(Gutenberg)エディタークラシックブロックで自動的に開きます。
切り替える準備はできていますか?
ステージングサイトを使用する(Use a Staging Site)
あなたがしたい最後のことはあなたの既存のサイトを壊すことです。これを回避する方法は、ステージングサイトで(a staging site)グーテンベルク(Gutenberg)をアクティブ化することです。これは、ライブサイトに損傷を与えることなくテストできる、Webサイトの正確なレプリカです。
テストサイトには、テーマ、プラグイン、オプション、およびコンテンツが含まれます。あなたのホスティング会社はステージングサイトを提供するかもしれません。そうでない場合は、WordPressステージングプラグイン( WordPress Staging plugin)を使用できます。
ステージングサイトが稼働したら、Gutenbergプラグイン( Gutenberg plugin)をインストールしてアクティブ化し、テストを開始します。または、WordPressの新しいインスタンスをコンピューターにインストールして、そこでテストします。
プラグインを確認してください(Check Your Plugins)
WordPressユーザーは、プラグインが一緒にうまく機能しない場合に何が起こるかをよく知っています。機能や競合するコードが原因の場合もあります。これは、インストールしたすべてのプラグインを使用しているかどうかを確認する絶好の機会です。そうでない場合は、それらを削除します。
また、 WordPress(WordPress)でコンテンツを編集しているときに、どのプラグインが使用されているかを確認する必要があります。Akismet、Contact Form 7、Google Sitemap Generator、WP Super Cacheなどの特定のプラグインは、エディターとは関係がなく、 Gutenbergを使用しても影響を受けません。
一方、機能を追加したり、WPクラシックエディターの外観を変更したりするプラグインは、Gutenbergと互換性がない可能性があります。特に、ショートコードを生成したプラグイン、カスタムスタイルを追加したプラグイン、または最近更新されていないプラグインは、通常、競合して問題を引き起こします。
グーテンベルク(Gutenberg)は、アクティブなプラグイン互換性(Plugin Compatibility)データベースを持っていました。ただし、アクティブに維持されなくなったため、シャットダウンされました。
最終データを確認し、データベース( download the database)をCSVファイルとしてダウンロードできます。アクティブなプラグイン互換性データベースにアクセスできない場合は、使用する各プラグインを手動でテストする必要があります。
テストサイトに新しい投稿を作成してみてください。グーテンベルク(Gutenberg)エディターを使用していることがわかりますが、見た目は異なります。入力を開始すると、段落ブロックが自動的に作成されます。新しい段落を追加するときに、新しいブロックを追加する必要はありません。EnterキーまたはReturnキーを押すだけです。(Just)
現在のプラグインが機能するかどうかを確認しようとしているので、各プラグインの使用方法を再現して、引き続き機能するかどうかを確認してください。
そうでない場合は、デフォルトのグーテンベルク(Gutenberg)ブロックで同じ機能を探し、そのブロックを追加して、コンテンツを追加します。
正しく機能しないプラグインのリストを保持して、Gutenbergで稼働するときにプラグインを削除できるようにしてください。
必要な機能のデフォルトブロックがない場合はどうなりますか?(What If There Is No Default Block For The Functionality You Need?)
すべてのブロックをチェックして、必要な機能が別のブロック内にあるかどうかを確認します。動作するものが見つからない場合は、プラグインの作成者に連絡して、Gutenbergと互換性があるようにプラグインを更新する予定があるかどうかを尋ねることができます。
他のすべてが失敗した場合は、必要なことを実行するGutenbergプラグイン( Gutenberg plugin)を見つけてください。動作しないプラグインをステージングサイトから削除します。
ライブ配信(Going Live)
ライブサイトに対して何かを行う前に、互換性のチェック時に何かを見逃した場合や別のエラーが発生した場合に備えて、サイト全体の完全なバックアップを作成してください。
テストサイトで必要なすべての変更を加えて、ライブサイトにプッシュすることができます。ただし、これにはある程度の技術的知識が必要です。したがって、開発者であるか、自分に合った開発者がいない限り、手動で変更を加えることをお勧めします。
動作しなかったプラグインを削除し、それらを置き換えるために見つけた新しいプラグインを追加することから始めます。古いプラグインが既存の投稿やページのデータを処理していて、新しいプラグインを壊さない場合は、それらをインストールしたままにしておくことができます。
古い投稿とページをグーテンベルクブロックに変換しますか?(Do You Want To Convert Your Old Posts & Pages To Gutenberg Blocks?)
各ページを開き、クラシックブロックメニュー(Block Menu)から投稿します。オプションを表示するには、3つのドットをクリックし(Click)ます(view options)。ドロップダウンメニューから[ブロックに変換(Convert to Blocks)]を選択します。
WPがコンテンツをグーテンベルク(Gutenberg)ブロックシステムに変換した後、各ブロックを確認する必要があります。ブロックナビゲーション(Use Block Navigation)(アイコンから)を使用して、投稿またはページのすべての部分を表示します。
上のスクリーンショットでわかるように、すべての段落、画像、リスト、および見出しが独自のブロックに含まれています。既存のページと投稿を新しいグーテンベルク(Gutenberg)システムに変換するのはすばやく簡単です。
プラグインをテストして新しいプラグインを見つけるには数時間かかる場合がありますが、これを行う必要があるのは1回だけです。グーテンベルク(Gutenberg)への移動を無痛でエラーのないものにするために、必ず上記の手順に従ってください。
How To Transition From The Classic WordPress Editor To Gutenberg
If you use WordPress 5.0 and higher, υnless you have been liνing under a rock, yoυ will have undoubtedly heard of thе Gutenberg update whiсh was merged into WordPress in Dеcember 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.