WordPressのブロックエディタが慣れない(笑)。

WordPressのバージョンが新しくなって、基本的な投稿のエディタは「ブロックエディタ」と呼ばれるものに変更されました。従来通りのクラシックなエディタも継続使用できるのですが、ブロックエディタを使ってみました。

このブロックエディタは、今までプラグインで提供されていたGutenbergというエディタが元になっているようですね。以前から話題になっていたのですが、そこまで記事レイアウトが凝ったブログを書いているわけでもなかったのでプラグインも最小限にしていて使ったことはありませんでした。

使い慣れるまではクラシックエディタの方が良いだろうと思っていましたが、2021年までしか対応しませんと公式で明言されてしまっているので、ブロックエディタを使い始めてみます。 今までの「続きを読む」は、ボタンで挿入ではなくて、ブロックというか段落で挿入する形のようですね。今までは記事というか雑記として文章を何も考えずに書いていたので、この「ブロック」という概念がなかなか自分の中で浸透してくれません(笑)。

20190101100351-DSC_6122

20181107163202-DSC_5715

20180921221915-DSC_1302

上は適当に画像を挿入してみた状態です。1つは文章と同じ段落内で、もう2つは段落を分けて挿入してみたものです。Flickrからの画像挿入は今まで通り「ギャラリー」から「メディアライブラリー」に進むとプラグインでインストールしている「FlickrPress」が見えたので挿入できましたが、文章と同じ段落内で挿入しても画像が表示されませんね。最初は横幅800pxで挿入していたので表示されなかったのですが、640px幅で挿入すると、同じ段落内で表示されました。この方が「文章に紐付いた画像」と認識しやすいのでいいかもしれないですね。

この段落では、「テキスト設定」から背景をグレーに、テキストをホワイトにしていますが、段落単位での設定になるので、部分的な変更はカスタムHTMLを使うしかないのかもしれません。なかなか使いにくいエディタですね。クラシックエディタに慣れてしまっていたのでなかなか馴染めないかもしれませんね。

色設定を何もしていない段落は文字の表示幅が広くなっているのはデザインテンプレートの仕様かもしれませんが、こちらもあまり凝った書き方をしているとテンプレートを変えた際に反映されないと嫌なのでそのままにしておきます。

見出し1(H3)でカラムを追加してみました。

段組みの見出し1

カラムで追加してみました。ブロックで「見出し」を挿入するとタイトルになるんですね。今後はきちんと見出しを付けながら記事を書いた方が良いのか迷っています(笑)。

20180921010917-DSC_1296

普通にブログ記事を書くようになるにはしばらくかかりそうですね。

段組みの見出し

こちらの見出しは「H6」です。少し文字が大きくなりますね。こちらは右側のカラムですなかなか改行がうまくいかないのですが、慣れですかね?Shift + Enterでブロック内の改行が出来るようです。

20181229135908-DSC_6102

左のカラムでは画像を別段落で挿入、右のカラムでは段落内で改行した後に挿入させていますが、表示の違いは微々たるものですね。

今まではクラシックエディタでリストを作成するのもひと手間かかっていましたが、ブロックエディタだと簡単に作成できるようになっていました。

  • リストもブロックとして挿入するようですね。
  • Enterでの改行は自動的にリストの追加になります。 Wordの挙動と似ていますね。
    • リスト内でのツリー構造化もできます。エディタ上ではリストマークが●から○になっていますが、プレビューだと同じ表示です。
    • 恐らくはテンプレートのCSSで制御されているからではないかと思います。
  • リストを作成してプレビュー表示した後に、エディタに戻ると体裁が崩れていることがあるのですが、中の文章を少しでも触ると元に戻ります。

段組みを終了してそのまま描き続けてみます。クラシックエディタと違って、リアルタイムでビジュアル的にグラフィカルに文章を入力しているせいか、若干文字の反映が遅い気がしますが、それは仕方が無いのかもしれませんね。

見出し(H2)。ブロックエディタは使いにくい(笑)。

改行した後にBackspaceで削除すると、改行だけでなく上の行の文末も一文字削除されてしまうのはブラウザの挙動なのか仕様なのかもわかりませんね。「ドロップキャップ」をONにすると、文頭の文字が4行分の大きさへ拡大されるようになります。少し前にテンプレートのCSSで実現させていた機能がエディタの標準で出来るようになったということでしょうか。

ブロック単位での記事内移動が簡単にできるのもこのエディタのポイントのようですが、同じFirefoxのバージョンを使っているのに、自宅では移動できるのに(ムーブ用のアイコンが左端に出る)職場では移動できません(ムーブ用のアイコンがカーソルを移動させても出てこない)。Chromeだと問題無くどちらの環境でも表示されたので移行のタイミングかもしれませんね。
改行も2行分一気に改行される時もあれば、ただの改行になる時もありました。この辺りの挙動が不安定なのにも気になるところです。

かなり高度な文章作成ができるようで、使いこなせればWordのように段組みや段落を使った文書レイアウトでの記事が書けそうですが、正直なところ、私の雑記ブログにそこまでの機能は必要ないかもしれませんね(笑)。
スマートフォンやタブレットでもブログの下書きを書くことがあるのですが、こちらはクラシックエディタのままになっているのも徐々にブロックエディタに切り替わっていくのでしょうか。

気になる800pxでの段落内画像挿入ですが、改行を間に挟んで挿入して、画像の後ろに改行を入れるとプレビューにも反映されるようになりました。

20181107163400-DSC_5718
800pxで挿入すると、ブロックエディタ上では表示されますが、そのままだとプレビュー表示では消えてしまっています。改行をすることで反映されたりもしますが、ひと手間かかりますね。
20181107163400-DSC_5718
この辺り、テンプレートに左右されているのか、ブロックエディタ自体の挙動が安定していないのかはわかりませんが、なんとなく今後は640pxで書けば安定してくれそうです。そこまで写真推しのブログでもないから問題ありませんが(笑)。

Leave a Reply

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください