wordpressでのスマホ対応webサイト制作・wpプラグイン・PHPプログラム・SNS活用・ 動画・bgmやテーマ曲アレンジまで考えるコラム!

【WPプラグイン無し】3行のコードで、ブロックエディタ&ブロックライブラリCSSを無効にする方法

   

こんにちは、管理人@SS_mshpです。

今回は、管理人が『お取引先さまのwebサイトでブロックエディタまわりを操作してみることになったけど、やっぱりクラシックがあるといいな』となったので、シンプルなコードでブロックエディタ無効にする方法をお伝えします。
流れ的には『クラシック派がブロックエディタ使ってみたい時の方法』『クラシックエディタプラグインのサポート期間』『ブロック無効化コード』という内容で進めていきます。さっそく確認してみましょう。

クラシックエディタ派が、『今後ブロックエディタを使ってみたい場合』はどうする?→クラシックブロックがあります

管理人は『ブロックは自分で作ればイイか』って考えなので、ブロックエディタは使わないんですけど、クラシックエディタ慣れしてる方にも、『今後はブロックエディタも使ってみたい』という方もいらっしゃるでしょう。


そういう場合は『ブロックエディタ・クラシックブロック使用』から利用してみても良いと思います。クラシックエディタがまるまるブロックになった感じで、操作感はクラシックに近いです。使い方は、『ブロック追加』ボタンを押して、『クラシックブロック』を選択。最初に出てこない場合は『全部表示』してみると良いかも。


こんな感じでエディタが登場。『クラシック&ビジュアルエディタ』の組み合わせだった方には、相性がよさそうです。

クラシックエディタプラグインのサポート期間について


Twitterにも少し書いた話題です。当初、クラシックエディタプラグインは『2021年までサポート』の予定でした。
しかし、最近(2020年)プラグイン公式のページを見たところ、『2022年』と、微妙にのびているようです

ブロックエディタプラグイン(グーテンなんちゃら)が、プラグイン公式ページでの評判が非常に悪い(星5個が600件程度に対して、星1個が2000件以上)というのもありますが、また延長なるかもとはいえ、いつかはサポート期間が終了します。クラシックエディタ使い続けるには、自力でなんとかします。

ブロックエディタ無効化と、ブロックライブラリCSS読み込み停止にするコード(functions.php)

これらの機能を無効にするには、2行・1行のシンプルなコードで対応可能です。
まず、以前行った『ブロックライブラリーCSS読み込み停止』を、今回も使います。


場所は『wp-includes/css/dist/block-library/style.min.css』にあります。ブロックライブラリーCSSのサイズは50KBと少しで、『単体であれば』放置しても問題ないかもしれません。しかし現在、WPシステムはどんどん肥大化しているので、他のファイルとあわさるとバカにできません。

そして、サクッと一行でブロックエディタ停止できるコードを付け加えるとこのようなコードになります(functions.php・管理人はWP5.51/PHP7.3で動作確認しました。貼る前にファイルをバックアップしておいてください。)。

あとがき・まとめ

  • クラシックエディタ派で今後ブロックに慣れたい場合は、クラシックブロック利用がベター
  • クラシックエディタプラグインのサポート期間は延びているが、いつかは切れるので自力対応が必要になる
  • ブロックエディタ、ブロックライブラリCSSは、それぞれ2行・1行のシンプルなコードで

まとめるとこんなところでしょうか。個人的にはWP公式がデフォルトで選択できるようにしてほしいんですが、たぶんやらない(笑)ので、自力でサクッと無効化した感じです。これに関しても『どちらかが絶対的に良い』ということはないので、使いやすい方を選んでください

*アトリエSS・web制作サービスページに移動します。webリニューアル・ロゴ・記事・wordpress化などでお力添えできます。

【カテゴリ】 - webメディア制作運用, WordPress管理画面カスタマイズ
【タグ】 - , ,

  関連記事

イベントハンドラonClickとopenメソッドで、複数youtube動画をボタンで切り替え、iframe内に表示する方法

今回は管理人が、お取引先のサイトにつけようとしたけど、より便利な ...

【WordPress条件分岐】is_singleとis_singularって違うの?→idやスラッグ指定、投稿タイプ指定の面で違いが

今回は、WPの条件分岐などに使うファンクションで、名前が超似てい ...

【CSS】横並びメニューで、最初だけボーダー無しとかにしたい場合は?→擬似クラスfirst-childを、効かない例も紹介

今回は、『メニューなどで、最初の要素だけボーダー無しにしたい』み ...

cssフレームワーク利用サイトで、意図しないpaddingなどを消すには?→同クラス上書き(例:bootstrap)

今回は、CSSフレームワークなどを使ってサイトを構築していると、 ...

【WordPressカスタムフィールド検索】meta_queryで、シリアライズ値が入ったフィールドを持つ記事をヒットさせるには?

今回は、ちょっと需要があるかもしれない『WordPressカスタ ...

WP管理・投稿画面カスタマイズ~『p』『h2』みたいなタグ・定型文をボタン1つで記事に追加したい

今回は、以前サイト制作のお取引先さまと話した、WPの記事を投稿す ...

【WP管理画面カスタマイズ】ユーザーページに項目追加&そのフィールドを一覧に出す方法

今回は、以前お仕事で少しやったんですが、『会員・顧客』や『複数執 ...