WordPress でフルスクリーンエディターを無効にする方法

WordPress 5.4がリリースされた際、エディターがデフォルトでフルスクリーンモードに切り替わり、多くのユーザーから不満の声が寄せられました。突然、見慣れた管理メニューがなくなり、気が散らないものの、時には分かりにくい執筆スペースとなりました。

クリーンなフルスクリーン表示は集中に役立ちますが、ダッシュボードツールへのクイックアクセスを失うのはイライラします。頼りにしているワークフローが予期せず変更されると、一般的な問題になることはわかっています。

私たちの経験では、WordPressでフルスクリーンエディターを無効にする簡単な方法が2つあります。このガイドでは、クイックトグルとより永続的なソリューションの両方について説明します。

WordPressがエディターにフルスクリーンモードを切り替えた理由

WordPress は、WordPress 5.0 で ブロックエディター（別名 Gutenberg）と呼ばれる新しいエディターを導入しました。この新しいエディターにより、ユーザーは一般的な要素にブロックを使用し、美しいコンテンツレイアウトを作成できます。

また、同じフォントと色を使用することで、記事やページがどのように表示されるかを模倣します。これは、WordPressテーマを使用する場合に当てはまります。

ただし、左側と上部に管理メニューがあると、少し散らかって見えました。画面上にはオプションが多すぎましたが、コンテンツの作成に集中している場合は必要ありません。

これに対処するため、WordPressコアチームはエディターをデフォルトでフルスクリーンにする決定をしました。

これは、ユーザーにより集中できる執筆体験を提供します。

さて、このフルスクリーンモードは新しいものではないことに注意することが重要です。すでに存在しており、ユーザーはオン/オフを切り替えることができました。

現在変更されたのは、WordPressで投稿を作成する際のデフォルトの表示がフルスクリーンモードになったことです。

これを踏まえて、WordPressでフルスクリーンモードを無効にする2つの異なる方法をご紹介します。以下のクイックリンクを使用して、希望する方法に直接ジャンプできます。

• 方法1：WordPressエディターのフルスクリーンモードを無効にする方法（簡単な方法）
• WordPressのフルスクリーンモードを無効にする方法（コードスニペット）

方法1：WordPressエディターのフルスクリーンモードを無効にする方法（簡単な方法）

WordPressのブロックエディターでフルスクリーンモードをオフにするのは非常に簡単です。

投稿またはページを編集し、画面右上にある 3 つの点のメニューをクリックするだけです。これにより、投稿エディターの設定メニューが表示されます。

ここから、「Fullscreen Mode」をクリックするだけでオフにできます。

投稿エディターは即座にフルスクリーンモードを終了し、管理サイドバーとトップツールバーが表示されるようになります。

WordPressは、フルスクリーンモードの設定をブラウザの一時ストレージに保存します。

ただし、別のブラウザに切り替えたり、シークレットモードを使用したり、別のデバイスから管理画面にアクセスしたりした場合、フルスクリーンエディターが再び表示されます。

複数のデバイス、ユーザーアカウント、またはブラウザを使用してWordPress管理画面にアクセスする場合、毎回切り替えるのは少し面倒かもしれません。

次の方法は、それを永続的に修正するのに役立ちます。

WordPressのフルスクリーンモードを無効にする方法（コードスニペット）

この方法では、WordPressサイトにコードを追加する必要があります。以前にこれを実行したことがない場合は、WordPressにコードスニペットを簡単に貼り付ける方法に関するガイドをご覧ください。

以下のコードを、WordPressテーマのfunctions.phpファイル、サイト固有のプラグイン、またはカスタムコードスニペットプラグインに入力する必要があります。

if (is_admin()) { 
    function jba_disable_editor_fullscreen_by_default() {
    $script = "jQuery( window ).load(function() { const isFullscreenMode = wp.data.select( 'core/edit-post' ).isFeatureActive( 'fullscreenMode' ); if ( isFullscreenMode ) { wp.data.dispatch( 'core/edit-post' ).toggleFeature( 'fullscreenMode' ); } });";
    wp_add_inline_script( 'wp-blocks', $script );
}
add_action( 'enqueue_block_editor_assets', 'jba_disable_editor_fullscreen_by_default' );
}

コードクレジット: Jean-Baptiste Audras

このコードは、ユーザーが管理画面ページを表示しているかどうかを最初に確認します。表示している場合、フルスクリーンエディターの状態を確認します。フルスクリーンエディターが有効になっている場合、それを無効にします。

投稿編集画面から手動でフルスクリーンモードをオンにすることは依然として可能であり、投稿エディターは問題なく機能します。

ただし、戻ると自動的にオフになります。この動作は、ウェブサイトの投稿エディターにアクセスできるすべてのユーザーに適用されます。

WPBeginner では、このようなコードは常に WPCode プラグインを使用して追加することをお勧めしています。これは、すべてのカスタムコードスニペットを安全に管理するために、当社自身のウェブサイト全体で使用しているのと同じツールです。

テーマのfunctions.phpファイルを編集せずにWordPressにカスタムコードを追加できるため、サイトを壊す心配はありません。詳細については、WPCodeの完全レビューをご覧ください。

WPCode を使用してスニペットを手動で追加したい場合は、WordPress にカスタムコードを簡単に追加する方法に関するチュートリアルに従ってください。

ただし、さらに簡単な方法があります。WPCodeには、フルスクリーンエディターを無効にするためのものを含む、1,500以上の既製のコードスニペットのライブラリが組み込まれています。したがって、このチュートリアルではその方法を使用します。

まず、無料のWPCodeプラグインをインストールして有効化する必要があります。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するこのチュートリアルに従ってください。

プラグインを有効化したら、WordPress ダッシュボードから コードスニペット » ライブラリ に移動します。

次に、「Disable Fullscreen Editor」スニペットを検索し、その下にある「Use snippet」ボタンをクリックします。

次のページで、WPCodeがコードを自動的に追加します。

また、適切な挿入方法を設定し、タグを追加して、カスタムコードスニペットをすべて追跡できるようにします。

その後、スイッチを「非アクティブ」から「アクティブ」に切り替え、「更新」ボタンをクリックするだけです。

これで完了です。これで、すべてのユーザーに対してフルスクリーンエディターが無効になります。必要に応じて、投稿エディターからいつでも手動でフルスクリーンモードに切り替えることができます。

この記事がWordPressの投稿エディターでフルスクリーンモードを無効にする方法を学ぶのに役立ったことを願っています。また、WordPressコンテンツエディターをマスターするためのヒントや、おすすめのドラッグ＆ドロップWordPressページビルダーもご覧ください。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。