クラシックエディターで書いた記事をブロックエディター（Gutenberg）で編集する手順を公開

2021年6月12日

ブロックエディターの便利さに慣れると、もはやクラシックエディターには戻れません。

私もすっかりブロックエディターに慣れた今、たまに過去にクラシックエディターで書いた記事を更新するとき、『あれ？ブロックエディターだと簡単にできるのにな。』と不便さをあらためて感じます。

そこで本記事では、過去にクラシックエディターで書いた記事をブロックエディターへ変更する方法・手順について解説します。

ブロックエディター化するための前提となる投稿設定

クラシックエディターで記事を書いている場合は、おそらくブラグインClassic Editorが有効化されている状態だと思います。

そのときの投稿設定が次のようになっていることを確認します。

①ダッシュボードメニュー　設定＞投稿設定　を開く

②エディターの切り替え許可を”はい”にしておく

もちろん、画面の下までスクロールして設定の保存をしておいてください。

ブロックエディター化するときの注意点

クラシックエディターで書いた記事をブロックエディター化する上での注意点です。

1. いったんブロックエディター化した記事をクラシックエディターに戻すのは難しい。
   （不可能ではありませんが、うまくいかない場合があります）
2. 見出し・段落・リスト（箇条書き）・画像といった基本となるコンテンツは、問題なく各ブロックに変換されるが、その他のコンテンツ（表、広告などHTMLでベタ書きしたコンテンツ、その他テーマに依存した囲み記事など）はブロック化後に再度入力しなおす必要がある。
3. クラシックエディターで作成した余白（[Enter]キーの繰り返し入力で作成した余白）は、無視される。したがって、あらたにスペースブロックで余白を整える必要がある。

上記の中で一番問題なのは②でしょう。

使用しているテーマにもよりますが、テーマ依存の装飾を使用している場合、レイアウト崩れが出たり、装飾そのものが消えたりする可能性があります。もちろん、テーマ自体がブロックエディター対応もきちんと考えられていれば全く問題ないこともありえます。

したがって不安な場合は、プラグインduplicate postなどで記事を複製してから、ブロックエディターへの変換お試しをしてみることをおすすめします。

実際にブロックエディター化する手順

手順そのものは簡単です。

1. クラシックエディターを開ける
2. ブロックエディターに切り替える
3. ”ブロックへ変換”をする
4. スペーサーブロックで余白を整える

実際に例を示しながら手順を紹介します。

①クラシックエディターを開ける

編集したい記事をクラシックエディターで開けます。

②ブロックエディターに切り替える

画面右の項目エディターで”ブロックエディターに切り替え”をクリックします。

すると、記事の本文全体が”クラシックブロックに格納された状態”に変化します。

これがどういう状態なのかを図示すると次のようになります。

③”ブロックへ変換”をする

クラシックブロックの上部に表示されている”ブロックへ変換”をクリックします。

すると、記事本文の各要素がブロックに変換されます。

これを図にすると次のようになります。
クラシックブロックの１つしかブロックがなかった状態から、複数のブロックに分かれます。

・段落として書かれていた文章は段落ブロックに、
・見出しとして書かれていた文章は見出しブロックに、
・画像は画像ブロックに、

と自動的に適正なブロックに変換されるわけです。

④スペーサーブロックで余白を整える

各ブロックの間はまったく余白がない詰まった状態です（クラシックエディターの余白は無視）。
スペーサーブロックを挿入して余白を適度に入れ、読みやすい記事に整えます。

ちなみに、スペーサーブロックはブロック一覧の”デザイン”にあります。

挿入したスペーサーブロックは、マウスで掴んで上下に動かすだけで余白の高さを調整できます。

私の場合、見出し２の余白は40pxと決めて、作成した余白をブロックのコピーで各見出し２の前に挿入していきますので、作業時間はさほどかかりません。

うまく変換できなかったブロックは再入力する

以上でブロックエディター化は終了ですが、ブロックエディター化するときの注意点②でも書いたように、一部うまく変換されないブロックがあります。これらを必要に応じて再入力します。

例えば、HTMLでベタ書きした広告は、ブロックエディターに変換後なぜか段落ブロックの中に入ったりします。

そこで、このようなブロックは削除して、カスタムHTMLブロックで広告を挿入しなおすのがよいでしょう。

まとめ

クラシックエディターで作成した記事をブロックエディターに切り替える方法と注意点について解説してきました。

解説手順そのものは

1. クラシックエディターを開ける
2. ブロックエディターに切り替える
3. ”ブロックへ変換”をする
4. スペーサーブロックで余白を整える

と非常に簡単です。

ただし問題となるのは、テーマ独自の装飾などの場合、うまくブロックに変換されない場合があることです。不安な場合は、プラグインduplicate postなどで記事をコピーしてトライすることをおすすめします。

私は現在この方法で、2019年以前にクラシックエディターで作成した記事は、順次ブロックエディター化していってます。

ブロックエディター化すると、レイアウトを簡単に変更したり、カラムブロック化して見やすくするなど、いろいろと見やすい記事にアップデートすることができます。

あなたの古い記事もブロックエディター化をおすすめします。

ブロックエディターの取り扱いに慣れていない方には、次の記事がおすすめです。