WordPressブロックエディタの一般的な問題13個とその解決策

WordPressは、2019年に古いクラシックエディターをGutenbergと呼ばれる全く新しいコンテンツエディターに置き換えました。このエディターはブロックを使用してWordPressでコンテンツを作成します。

しかし、使用中に煩わしい問題に遭遇することがあります。WPBeginnerでも、ブロックエディターの使用中に複数のエラーを経験しました。

この記事では、最も一般的なWordPressブロックエディターの問題を修正する方法を共有し、ワークフローを改善できるようにします。

WordPressブロックエディターとは？

WordPressブロックエディター、またはGutenbergは、WordPress 5.0リリースで導入されたコンテンツエディターです。それ以来、WordPressはこのエディターを改善し、新しい機能と機能を追加してきました。

クラシックエディターと比較して、より多くのカスタマイズ機能を提供します。コンテンツにさまざまな要素を追加するためのさまざまなブロックがあり、外観とスタイルを変更するためにコードを編集する必要はありません。

ブログやページが、WordPressテーマのフォントと色を模倣することで、リアルタイムでどのように表示されるかを示そうとします。

例えば、画像ブロックを使用してブログ記事に画像を追加できます。さらに、ブロックを使用して、画像のスタイル、サイズ、配置などのオプションを利用できます。

さらに、多くのWordPressプラグインがコンテンツエディターに独自のブロックを追加します。これにより、フォーム、ソーシャルメディアフィード、目次などを数回クリックするだけで簡単に埋め込むことができます。

とはいえ、ブロックエディターは完璧ではありません。他のWordPressプラグインと同様に、さまざまなエラーやバグに遭遇する可能性があります。

コンテンツエディターには、いくつかの一般的な問題があります。以下のリンクをクリックすると、チュートリアルのさまざまな部分にジャンプできます。

1. WordPressブロックエディターの動作しないエラーの修正

ユーザーが直面する最も一般的な問題の1つは、「WordPressブロックエディターが機能しない」というものです。

このエラーが発生する理由はたくさんあります。例えば、古いテーマ、不具合のあるプラグイン、その他の技術的なエラーが原因である可能性があります。

WordPressブロックエディターは、ユーザープロファイルを作成する際にビジュアルエディターを無効にするなど、サイトの設定が誤って構成されている場合にも機能しない可能性があります。

これは、WordPressダッシュボードからユーザー » プロフィールに移動することで確認できます。ここで、「執筆時にビジュアルエディターを無効にする」オプションが選択されていないことを確認してください。

問題がまだ解決しない場合は、サイトのすべてのプラグインを非アクティブ化してみてください。これにより、プラグインが原因で発生する可能性のある競合を特定し、ブロックエディターが機能しないのを停止するのに役立ちます。

これを修正する別の方法は、WordPressテーマを更新することです。古いテーマは、ブロックエディターが機能しないというエラーを引き起こす可能性があります。私たちのガイド「WordPressテーマをデータやカスタマイズを失うことなく更新する方法」を参照してください。

2. WordPressブロックエディターがクラッシュし続ける

一部のユーザーが直面するもう1つの一般的な問題は、WordPressブロックエディターが予期せずクラッシュすることです。

クラッシュすると、「エディターで予期しないエラーが発生しました」というエラーメッセージが表示されます。WordPressはその後、回復を試みる、投稿テキストをコピーする、エラーをコピーするという3つのオプションを表示します。

この問題には複数の原因が考えられます。たとえば、プラグインがブロックエディターを破損してこのエラーを表示したり、WordPressのバージョンが最新でない場合があります。

すべてのプラグインを非アクティブ化してから1つずつ再アクティブ化することで、これを修正できます。別の修正方法は、WordPressをTwenty Twenty-Fourのようなデフォルトテーマに変更し、問題が続くかどうかを確認することです。

WordPressプラグインとテーマを確認した後もこの問題が発生している場合は、WordPressのバージョンを更新し、WordPressキャッシュをクリアしてみてください。

3. コンテンツエディターで無効なJSONエラーを削除する

ブログ投稿またはページを編集しているときに、ブロックエディターの「更新」ボタンをクリックすると、「応答が無効なJSON応答です。」というエラーメッセージが表示される場合があります。

WordPressブログを編集している間、WordPressはバックグラウンドでウェブサイトサーバーと継続的に通信しています。このエラーは、WordPressがサーバーから応答を受信できなかった場合、または応答がJSON形式でない場合に発生します。

無効なJSONエラーが発生する可能性のある理由と、その修正方法をいくつかご紹介します。

• 設定でWordPressのURLを確認する – サイトの設定にあるWordPressアドレスとサイトアドレスが正しいことを確認する必要があります。設定 » 一般 ページに移動し、URLが同じかどうかを確認してください。サイトアドレスが異なる場合、JSONエラーがトリガーされる可能性があります。

• WordPressでパーマリンク設定を修正する – WordPressでは、ページや投稿にSEOフレンドリーなURLを設定できます。ただし、設定が正しくないと、ブロックエディターが有効なJSON応答を取得するのが困難になる場合があります。適切なパーマリンク形式を選択してください。
• WordPress .htaccessファイル設定を確認する – .htaccessファイルは、WordPressでSEOフレンドリーなURL（パーマリンク）を管理するための設定ファイルとして使用されます。通常、WordPressは自動的に再生成して更新します。ただし、設定が正しくない場合や.htaccessファイルが古い場合は、JSONエラーが発生する可能性があります。
• REST APIデバッグログを表示 – REST APIは、WordPressがサイトのサーバーと通信するために使用する一連の技術です。JSONエラーは、REST APIでエラーが発生したことを意味する場合もあります。WordPressのサイトヘルス画面でREST APIログを表示することで確認できます。
• すべてのプラグインを無効にする – WordPressプラグイン間の競合も、無効なJSONエラーの原因となる可能性があります。ウェブサイト上のすべてのプラグインを無効にして、エラーが再発するかどうかを確認してください。
• クラシックエディターに切り替える – JSON エラーを解決できない場合は、WordPress のクラシックエディターに戻すことができます。古いコンテンツエディターは、REST API に依存してウェブサイトサーバーから JSON レスポンスを取得しません。

これらのヒントの詳細については、WordPressで無効なJSONエラーを修正する方法に関するガイドをご覧ください。

4. 更新失敗/公開失敗エラーの解決

WordPressブロックエディターでブログ投稿やページを更新または公開する際に表示される可能性のあるもう1つのエラーは、「更新に失敗しました。オフラインの可能性があります。」です。

この問題は、WordPress REST APIがWordPressデータベースと通信できない場合に発生します。

ブロックエディターがWordPressホスティングデータベースとの送受信リクエストに失敗すると、サイトのさまざまな部分（ブロックエディターを含む）が機能しなくなります。

インターネットに接続されていないか、接続が失われた場合、REST APIが機能しなくなる可能性があります。この問題を解決するには、インターネット接続が正常に機能していることを確認してから、ページを更新または公開してみてください。

それ以外にも、WordPressダッシュボードからツール » サイトヘルスに移動して、REST APIログを表示できます。REST APIに問題がある場合は、「推奨される改善」セクションに表示されます。

エラーログには、REST APIで何が起こったかが表示され、問題の原因となった可能性のある手がかりが得られる場合があります。

この問題の修正方法については、WordPressの更新に失敗するエラーを修正する方法に関するガイドをご覧ください。

5. WordPressブロック間の空白の追加または削除

WordPressブロックエディターを使用してカスタムページや投稿を作成する際に、ブロック間のスペースが多すぎたり少なすぎたりすることに気づく場合があります。

通常、WordPressのテーマが間隔を制御します。ただし、ブロックエディターには、ページのレイアウトを制御し、より良いユーザーエクスペリエンスを提供するオプションもあります。

例えば、スペーサーブロックを追加して空白スペースを作成できます。プラスボタンをクリックして、コンテンツのどこにでもスペーサーブロックを追加するだけです。

このように、ブロック間に余分なスペースを追加できます。

WordPressでは、スペーサーブロックのサイズを調整することもできます。ブロックを上下にドラッグして、大きくしたり小さくしたりできます。

ブロック間の余分な空白を削除したい場合は、WordPressテーマにカスタムCSSを入力するか、CSS HeroのようなCSSプラグインを使用する必要があります。

このプラグインを使用すると、コードを編集せずにウェブサイトのCSSを編集できます。ブロック間の空白を調整するために使用できるさまざまなスペーシングオプションを提供します。

SeedProdを使用してWordPressでカスタムページを作成し、デザインを完全に制御することもできます。

詳細については、WordPressのブロック間の空白を追加または削除する方法に関するガイドをご覧ください。

6. 書式設定の問題なくコンテンツをコピー＆ペーストする

デスクトップアプリやウェブページからブロックエディターにコンテンツをコピー＆ペーストすると、不要な書式設定が発生することに気づいたことはありますか？

貼り付けたコンテンツのフォントと色がWordPressテーマと一致しないことがわかります。これは、Microsoft WordまたはGoogleドキュメントを使用してコンテンツを作成し、それをブロックエディターに入力した場合に非常に一般的です。

元のフォーマットを維持するための簡単なヒントの1つは、WordやGoogleドキュメントの見出しスタイルを使用することです。これにより、コンテンツをブロックエディターに貼り付ける際に、WordPressは自動的に見出しレベルを認識します。

それに加えて、コンテンツを貼り付けた後、ページまたは投稿のHTMLコードを確認する必要があります。WordPressコンテンツエディターでは、ブロックを選択し、3つの縦のドットオプションをクリックできます。

ドロップダウンメニューから、「HTMLとして編集」オプションを選択するだけです。

この方法で、太字や斜体の誤り、不要なテキストなど、書式設定のエラーを見つけることができるはずです。

詳細については、WordPressで書式設定の問題なくコピー＆ペーストする方法に関するガイドをご覧ください。

7. WordPressで画像のアップロード問題を修正する

次に、WordPressブロックエディターで画像をアップロードする際にエラーが表示される場合があります。これは、WordPressで一般的な画像の問題の1つです。

このエラーの主な原因は、ファイル権限が正しくないことです。すべてのウェブサイトファイルはウェブホスティングサービスに保存されており、機能するには特定のファイルおよびディレクトリ権限が必要です。

これらの権限が正しくないと、WordPressがホスティングサーバーへのファイルの読み込みやアップロードができなくなる可能性があります。その結果、アップロードした画像がメディアライブラリから消えたり、「」というエラーが表示されたりすることがあります。

「wp-content/uploads/2019/04 ディレクトリを作成できません。サーバーによって親ディレクトリが書き込み可能になっていますか？」

この問題を解決するには、ファイル権限を編集する必要があります。FTPクライアントを使用して/wp-content/フォルダにアクセスできます。ここからフォルダを右クリックしてファイル権限を変更できます。

WordPressでの画像アップロードの問題を修正する方法に関するステップバイステップガイドに従って、この修正の詳細を確認してください。

8. HTTP 画像アップロードエラーの修正

WordPressブロックエディターで画像をアップロードする際に発生する可能性のあるもう1つの問題は、HTTPエラーです。

WordPress では、メディアライブラリに画像をアップロードする際に一般的な「HTTP」エラーが表示され、画像のプレビューが表示されなくなります。

この問題を引き起こす可能性のある要因はいくつかあります。イライラするのは、エラーメッセージが実際原因の手がかりをあまり与えてくれないことです。

これを修正するために、いくつかのことを試すことができます。まず、数分待ってから画像を再アップロードしてみてください。ウェブサイトのサーバーが、異常なトラフィックやサーバーリソースの不足などの問題に遭遇することがあります。

それに加えて、WordPressのメモリ制限を増やすことで、メモリ不足がHTTPエラーを引き起こすのを防ぐことができます。試せるその他のことには、WordPressによって使用される画像エディターライブラリの変更や.htaccessファイルの編集があります。

また、ログインが期限切れになっている可能性があり、このエラーはログイン画面に移動してユーザー名とパスワードを再入力することで解消される場合があります。

WordPressでのHTTP画像アップロードエラーの修正方法に関するガイドで、これらのヒントのそれぞれを詳しく読むことができます。

9. WordPressでスケジュール投稿エラーを削除する

WordPressにはブログ投稿をスケジュールするための組み込みオプションがあることをご存知でしたか？

WordPressコンテンツエディターでは、ブログ投稿の公開日時を変更できます。ただし、スケジュールされたコンテンツが設定時刻に公開されない場合があります。

このエラーの主な原因は、WordPressホスティング環境またはプラグインの競合によるものです。WordPressは、投稿を後で自動的に公開するために「cron」と呼ばれるテクノロジーを使用しています。

プラグインまたはウェブサイトのホスティングサーバーがcronジョブに影響を与えている場合、WordPressでスケジュールされた投稿エラーが見逃されることになります。

WordPressサイトのタイムゾーンを確認することで、この問題を解決できます。サイトのタイムゾーンが、ブログのスケジュール設定に使用したいタイムゾーンと一致していない可能性があります。

WordPress管理画面の設定 » 一般に移動し、タイムゾーンのセクションまでスクロールダウンしてください。

WordPressキャッシュのクリアとWordPressメモリリミットの引き上げによっても、この問題を修正できる場合があります。

WordPressでのスケジュール済み投稿エラーの修正方法に関するガイドをご覧ください。

10. WordPressブロックエディターでの配置問題の修正

WordPress の別の一般的なブロックエディターの問題として、コンテンツや画像が正しく配置されない場合があります。

たとえば、ブログ投稿に箇条書きリストを追加して中央揃えにしたとします。しかし、投稿の編集時にブロックエディターではリストが左揃えで表示されます。同様に、中央揃えの画像ブロックが左揃えまたは右揃えで表示される場合があります。

Gutenberg プラグインが WordPress サイトにインストールされて有効になっている場合、ブロックの配置に問題が発生する可能性があります。Gutenberg プラグインを無効にして、問題が解決するかどうかを確認することをお勧めします。

別の解決策として、中央揃えしたいテキストに次のカスタムCSSコードを追加します。

.has-text-align-center {
text-align: center;
}

WordPressブロックエディターでの画像の追加と配置方法に関するガイドも参照してください。

11. Facebookのサムネイル表示不具合の解決

Facebookで記事を共有したときに、投稿のサムネイルが正しくないことに気づいたことはありますか？

この問題は、競合するプラグイン、コンテンツ配信ネットワーク（CDN）の問題、またはFacebookのOpen Graphメタタグの欠落によって引き起こされる可能性があります。

これはWordPressブロックエディターでは問題になりませんが、コンテンツエディターを使用してFacebook用のOpen Graph画像を指定できます。

この問題を迅速に解決するには、All in One SEO（AIOSEO）プラグインを使用できます。これはWordPress向けの最高のSEOプラグインであり、サイトを検索エンジンやソーシャルメディア向けに最適化するのに役立ちます。

有効化すると、WordPressコンテンツエディターにAIOSEO設定メタボックスが表示されます。「ソーシャル」タブに移動するだけです。

次に、「画像のソース」セクションまで下にスクロールできます。

ドロップダウンから、記事が共有されるときにFacebookやその他のソーシャルメディアサイトに表示する画像を選択できます。

WordPressでのFacebookのサムネイル不正問題の修正方法に関するガイドに従って、この問題を解決する他の方法について学んでください。

12. FacebookおよびInstagramのoEmbed問題の修正

FacebookやInstagramのコンテンツをWordPressに追加する際に直面する、もう一つのソーシャルメディア関連のブロックエディターの問題があります。

以前は、WordPressでInstagramやFacebookの投稿を簡単に埋め込むことができました。しかし、FacebookはoEmbedの動作方法を変更しました。

WordPressに動画、画像、アップデート、その他のコンテンツを埋め込むことができなくなります。代わりに、コンテンツのプレーンなURLが表示されます。

Smash BalloonのようなソーシャルメディアWordPressプラグインを使用すると、この問題を簡単に解決できます。oEmbedを使用してFacebookやInstagramのコンテンツを簡単に埋め込むことができ、ウェブサイトにソーシャルメディアフィードを表示することもできます。

詳細については、WordPressでのFacebookおよびInstagramのoEmbed問題の修正方法に関するガイドをご覧ください。

13. ブロックエディターで埋め込みコンテンツのプレビューが表示されない

これはWordPress 5.7バージョンで発生した問題です。YouTubeからの動画やVimeoを埋め込んだり、SpotifyやSoundCloudからオーディオを追加したりすると、ブロックエディターにプレビューが表示されませんでした。

代わりに、ブロックには「プレビューが利用できません」または「このブロックでエラーが発生したため、プレビューできません」と表示されるだけでした。この問題の主な原因は、デフォルトの遅延読み込み機能でした。

WordPress 5.5では、iFrameがデフォルトで遅延読み込みされるようになり、埋め込まれた画像などのコンテンツは、訪問者がコンテンツの場所までスクロールするまで読み込まれませんでした。

この問題を簡単に修正するには、WordPressのバージョンを更新してください。このバグはその後解決されています。バージョン5.7以前を使用している場合は、WordPressを最新バージョンに更新することを強くお勧めします。

この記事が、一般的なブロックエディターの問題とその修正方法について学ぶのに役立ったことを願っています。また、一般的なWordPressのエラーとその修正方法、およびWordPressでの504ゲートウェイタイムアウトエラーの修正方法に関するガイドも参照してください。

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterやFacebookでも私たちを見つけることができます。