Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

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

WordPressのフルスクリーンエディターを無効化する方法を探しているユーザーの声を多く聞いています。

WordPress 5.4の更新では、投稿エディターやページエディターを初期設定でフルスクリーンモードで開くなど、多くの変更がもたらされました。この邪魔にならないモードはクリーンで使いやすいエクスペリエンスを提供しますが、ユーザーによっては通常のコンパクト表示に戻りたいと思うかもしれません。

この投稿では、WordPressのフルスクリーンエディターを簡単に無効化し、通常のエディターに戻す方法を紹介します。

Turning off the fullscreen mode in WordPress post editor

なぜWordPressはエディターをフルスクリーンモードにしたのか?

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

また、WordPressテーマと同じフォントや色を使用することで、投稿やページがどのように見えるかを模倣します。

しかし、左に管理メニュー、上に管理メニューがあるため、少しごちゃごちゃした印象を受けた。画面上にオプションが多すぎて、コンテンツを書くことに集中するのであれば必要ない。

WordPress editor without fullscreen mode

これに対処するため、WordPressのコアチームはエディターを初期設定でフルスクリーンにすることを決定し、ユーザーが気が散ることなく文章を書くことができるようにした。

Fullscreen editor in WordPress

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

今回変更されたのは、フルスクリーンモードがWordPressで投稿する際の初期設定表示になったことだ。

WordPressエディターのフルスクリーンモードを無効化する方法(簡単な方法)

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

投稿日またはページを編集し、画面右上の三点メニューをクリックしてください。投稿エディターの設定メニューが表示されます。

ここから「フルスクリーンモード」をクリックしてオフにする。

Turn off fullscreen mode in WordPress

投稿エディターは即座にフルスクリーンモードを終了し、管理サイドバーと上部ツールバーを表示し始めます。

Exiting 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's homepage

WPCodeを使用して上記のスニペットを手動で追加したい場合は、WordPressでカスタマイザーコードを簡単に追加する方法のチュートリアルに従うだけです。

しかし、もっと簡単な方法があります。WPCodeには、1,500以上の既製コード・スニペットのビルトイン・ライブラリが付属しており、その中にはフルスクリーンエディターを無効化するものも含まれています。そこで、このチュートリアルではその方法を使います。

まず、無料のWPCodeプラグインをインストールし、有効化する必要があります。WordPressプラグインのインストール方法については、こちらのチュートリアルをご覧ください。

プラグインを有効化したら、WordPressダッシュボードからCode Snippets ” Libraryにアクセスしてください。

次に、「フルスクリーンエディターを無効化」スニペットを検索し、その下にある「スニペットを使用」ボタンをクリックします。

Select the 'Disable Fullscreen Editor' snippet from the WPCode library

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

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

WPCode automatically adds the code to disable the fullscreen editor

その後、スイッチを「非有効化」から「有効化」に切り替え、ページ上部の「更新」ボタンをクリックするだけだ。

Switch the code snippet to Active and click Update in WPCode

以上です。これで、すべてのユーザーに対してフルスクリーンエディターが無効化されます。必要であれば、投稿エディターから手動でフルスクリーンモードに戻すことができます。

この投稿が、WordPress投稿エディターでフルスクリーンモードを無効化する方法のお役に立てば幸いです。WordPressコンテンツエディターを使いこなすためのヒントやドラッグ&ドロップで使えるWordPressページビルダーのエキスパートピックもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

アバター

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

ツールキットへの無料アクセス - すべてのプロフェッショナルが持つべきWordPress関連製品とリソースのコレクション!

Reader Interactions

7件のコメント返信を残す

  1. Syed Balkhi

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. John Antonacci

    doesn’t work for me from a plugin or in theme functions.php

    unless I misunderstand what this is supposed to do.

    • WPBeginner Support

      Possibly, we would recommend trying the easy way from the article to see if you notice the change that way in case you have something on your site that may be overriding the default display.

      管理者

  3. Kurt

    I finally got around to reading this tip via an email update from you back in April. The permanent solution works beautifully.

    Thank you for this wonderful tip.

    • WPBeginner Support

      Glad our content and newsletter were helpful :)

      管理者

  4. Timothée Moulin

    Hey, thanks for the tip. I dont’ think you should worry about checking if you are in the admin as enqueue_block_editor_assets is only called when you are in the admin AND that you are on the Gutenberg editor which makes it truely specific.

    • WPBeginner Support

      Checking if the user is an admin is a safety measure should something about the function change in the future :)

      管理者

返信を残す

コメントありがとうございます。すべてのコメントは私たちのコメントポリシーに従ってモデレートされ、あなたのメールアドレスが公開されることはありませんのでご留意ください。名前欄にキーワードを使用しないでください。個人的で有意義な会話をしましょう。