私のブログはWordPressのテーマにCocoonを使用させてもらっています。ブログを始めてもうすぐ2年になりますが、いまだにクラッシックエディタで書いています。現在主流となっているエディターはブロックエディタです。まあ、書ければどっちでもいいかなと思っていたのですが最近記事内に画像の挿入や、吹き出しを入れるときにもっと簡単にできる方法があるんじゃないかと思い始めました。
そんななかCocoonブロックを覚えると簡単に吹き出しや画像が挿入できそうなことがわかりました。
色々考えた結果、今のうちに慣れていこうと判断し、ブロックエディタ(Gutenberg)で書いていくことにしました。
当記事は、ブロックエディタ初心者の私がブロックエディタにした時の疑問やよかったことを随時更新していこうと思います。
Cocoonでブロックエディタを使う設定
Cocoonでブロックエディタを使用する場合は、以下の設定を変更する必要があります。
Cocoonのエディタ設定
[Cocoon設定]→[エディター]からGutenbergエディターを有効にするをチェックする。

これだけでブロックエディターが使用できるようになります。
TinyMCE Advancedのプラグインを入れている場合の注意点
以前クラッシックエディターを使用していてTinyMCE Advancedというビジュアルエディタを拡張するプラグインを入れている人は注意が必要です。ブロックエディタではスラッシュ[/]を入力することで挿入するブロック一覧を表示するショートカットの機能があります。

TinyMCE Advancedが有効になっていると以下の画面で / を入力してもなにも表示されません。
本来であると以下のように挿入したいブロックが表示されるはず・・・・・

TinyMCE Advancedを無効にしてはダメ
TinyMCE Advancedのプラグインを無効にしたところ[/]でブロック一覧は出てくるようになりました。良かった良かったと思って使っていて、ふと過去の記事の編集をしようとしたところ以下のような画面が表示されて編集できなくなっていました。
"tadv/classic-paragraph"ブロックはサイトでサポートされていません。そのまま残すか・・・・

過去にTinyMCE Advancedとクラシックエディタの環境で使用していた場合は、このメッセージが出るようです。(正直よくわかりませんが・・・)
試行錯誤した結果、TinyMCE Advancedは有効化した状態で[クラッシック版の段落もしくはクラッシクブロックをデフォルトのブロックにする(ハイブリッドモード)のチェックを外すことで過去記事の編集も/でのブロック一覧も表示されました。同じ事象になった人は試してみてください。私の環境だけで発生した事象かもしれません。

チェックを外す

上記設定で、ブロックエディタを使う環境は整ったと思います。
コメント