WordPressでブロックエディタが表示されない場合の対処法

未分類

お恥ずかしながら、私は今まで運営していたブログでブロックエディタと呼ばれる最近の投稿フォームが使えないサイトがありました。外観はElementorで構築していたにも関わらず。。。
いえ、正確にはブロックエディタは表示されていたのですが、文章を入力しようとすると、必ずClassicEditorでブロックが作成されてしまうのです。ClassicEditorだとAndroid/iOSなどのWordpressアプリで投稿の編集(画像のアップロードなども含め)ができず、ちょっと困っていたのです。

最終的には解決したのですが、それまでに対応したことを一つずつ紹介していきます。

結論

私の場合には、Advanced Editor Toolsというプラグインを無効にすることで解決しました。このプラグインは、エディタの機能を拡張するプラグインでした(昔、機能が少ない時に追加していたのを失念していました)

画像に alt 属性が指定されていません。ファイル名: cad092ca5450efd6bc1d2f2cceaa839b-1024x92.png

そういう意味では、あらゆるプラグインはやはり要注意ですね。各種プラグインを無効にして問題が再発しないか。簡単に確認するならやはりそこからですね。

画像に alt 属性が指定されていません。ファイル名: 237bbe7403b7f6177e344cb1a07c80b6-1024x187.png

テーマをプラグインで設定している場合、無効にするとイチから設定がやり直しのケースがあります。怖い場合には、ローカルでWordpress開発環境を立てて検証されることをお勧めします。

確認するべきポイント

Classic Editor プラグインが有効

  • 有効化されていると投稿が自動でクラシックに。
  • 対処:一旦 無効化
  • もし使い続けたいなら「設定 → 投稿設定(=Writing) → デフォルトのエディター」を “ブロックエディター” に変更し、「ユーザーにエディターの切り替えを許可」→ “はい” に

WordPress 本体が古い / 翻訳が壊れている

  • WP 5.x 以上が前提。最新版へアップデート。
  • 「ツール → サイトヘルス」で問題が出ていないか確認。

ここからは、function.php関連となります。

テーマやプラグインで無効化する処理が入っている

add_filter('use_block_editor_for_post', '__return_false');
add_filter('use_block_editor_for_post_type', '__return_false');
add_filter('gutenberg_can_edit_post_type', '__return_false');

カスタム投稿タイプ(CPT)がブロック対応になっていない

  • ブロックエディタを使うには show_in_rest => true が必須。さらに supports に ‘editor’ を含める:
register_post_type('foo', [
  'show_in_rest' => true,
  'supports' => ['title','editor','thumbnail','custom-fields'],
  // …その他
]);

以下、テンプレートファイル内での確認事項

テーマのブロック対応不足

最新のテーマでは対応されているケースがほとんどだが、最低限以下の記載があることを確認する

add_action('after_setup_theme', function(){
  add_theme_support('wp-block-styles');
  add_theme_support('editor-styles');
  // editor-style.css 等を読みたい場合
  add_editor_style('editor-style.css');
});

まとめ

サーバー上での見慣れないエラーほど焦ることはありません。自分自身の環境で多少壊れても大丈夫であれば、まずはプラグインの停止(更新)とWordpress本体の更新が速い解決法だと感じました。

会社の環境の場合などでエラー時のリカバリが怪しい場合には、無理せずローカル環境にWordpressを構築して一つずつデバッグしていきましょう。

ローカルにWordpress環境を構築する方法としては、XAMPPでのワンクリックインストールなどが有名です。以下の記事などにもあるので、参考にしてみてください。

【図解付】Local(ツール)でWordPressのローカル環境を構築する方法
WordPressはサーバーにインストールして利用するソフトですが、サーバーの維持費や導入の手間がかかるのが難点です。そこでWordPressのカスタマイズや稼働テストをする際には、パソコン内にローカル環境を構築して、そこにWordPres...

コメント

タイトルとURLをコピーしました