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

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

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

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

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

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

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

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

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

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

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

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

• WordPressブロックエディタが機能しないエラーの修正
• WordPressブロックエディターがクラッシュし続ける
• コンテンツエディターの無効な JSON エラーを削除する
• 更新失敗 / 公開失敗エラーの解決
• WordPressブロック間の空白の追加または削除
• 書式設定の問題なくコンテンツをコピー＆ペーストする
• WordPressでの画像アップロードの問題を修正する
• HTTP画像アップロードエラーの修正
• WordPressでスケジュール投稿エラーを見逃さないようにする
• WordPressブロックエディターでの配置問題を修正する
• Facebookのサムネイル表示不具合の解決
• FacebookとInstagramのoEmbedの問題を修正する
• ブロックエディターで埋め込みコンテンツのプレビューが表示されない

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

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

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

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

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

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

WordPressテーマを更新することで、この問題を解決することもできます。古いテーマは、ブロックエディタが機能しないエラーの原因となることがあります。テーマをデータやカスタマイズを失うことなく更新する方法については、こちらのガイドをご覧ください。WordPressテーマをデータやカスタマイズを失うことなく更新する方法。

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

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

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

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

すべてのプラグインを無効化してから、一つずつ再度有効化することで、これを修正できます。別の修正方法として、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エラーを修正する方法に関するガイドをご覧ください。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ブロック間の空白の追加または削除方法（4つの方法）に関するガイドをご覧ください。

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 での画像アップロードの問題を修正する方法（ステップバイステップ）に関する詳細については、WordPress での画像アップロードの問題を修正する方法のステップバイステップガイドに従ってください。

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

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

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

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

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

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

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

WordPressでのHTTP画像アップロードエラーの修正方法に関するガイドで、これらのヒントのそれぞれを詳しく読むことができます。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 問題の修正方法に関するガイドを参照してください。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でもフォローできます。