いに登場

はい、そういうわけでございまして。
今朝いつものように管理しているWebサイトの巡回を行っていたトコロ。

来ていました。
来てしまいました。

WordPress 5.0
(ちなみに、各バージョンごとに付けられている「ジャズミュージシャン名」的には『Bebo Valdés』)

4.0のリリースから4年と3ヶ月。
ついに、メジャーアップデートの日が来ましたよ。

今まで散々土俵際(4.8x〜4.9x)で粘っていましたので、
なんだかずーっとこのままで行くんじゃないかなーってドコかで思っていました。

いつも急よねー。心の準備ってものが欲しいわよねー。できれば見なかったことにしたいわー。
でもワタシってば今まで散々「バージョンアップ即乗り推奨」とか言ってきたのよねー。困ったことにー。

……コホン。わかりました。やりましょう。いつか通る道です。
華麗に地雷原を走りきってみせようじゃないですか。

ということで本日は、「WordPress 5.0 緊急バージョンアップ」の模様をお届けします。


はい、来てますね。5.0。
en_US版が先に来て、適当にバグ取りした頃にja版が来るのかと思ったら、同時でした。

逃げ場なし。

では、ポチッと行きますよ。すー、はー。
ポチッとな。

しばしの沈黙があって、更新完了です。

特に何事も起こらず、ウェルカム画面が表示されました。
ギラギラと輝く「5.0」の文字。今までずっと4.xシリーズでしたので、だいぶ違和感がありますね。

この画面でもガッチリアピールされていますが、
どうやら今回のアップデート、メインは「新エディター」のようです。

こちらの新エディター、名前を『Gutenberg エディター(グーテンベルグ エディター)』と言います。


Gutenberg エディターとは

このエディターは、リッチな投稿や固定ページの作成を簡単にする、新たな執筆体験を生み出します。また「ブロック」によって、今日のショートコード、カスタム HTML や得体の知れない埋め込みが実現していることをより簡単にします。— マット・マレンウェッグ

Gutenberg は単なるエディターではありません。現在はエディターに注力していますが、このプロジェクトはパブリッシング体験全体に影響を与えるものです。今後はカスタマイズに注力していく予定です。(プラグインページより


ほほう……これはもしかすると相当大きな変化なのでは?

「10年ほぼ大きな変更がなかったレイアウトを見直す」
と書いているくらいですので、制作チーム側の気合と意気込みが否応なしに感じられます。

では。

そんなGutenberg エディターについては「後ほど」チェックするとして、
その他の部分をササッと見ておきましょう。

新しいテーマが加わりました。
名前を「Twenty Nineteen」と言います。

Twentyホニャララシリーズもかなり増えてきましたね。
この先もずっとこのネーミングルールで行くのか、MacOSの名前バリに気になるところです。

今回の特徴は「Gutenberg エディター対応」とのこと。なるほどなるほど。

サイドバー等の各機能については、パッと見変更は行われて……いないようです。
(サイドバーが標準よりゴテゴテしているのは、ワタシが入れているテーマやプラグインが原因です)

細かい表現等は変わっているのでしょうけど、このくらいなら迷子になる心配はなさそうです。
記事を直接イジらないのであれば、今までどおりの感覚で触れそうですね。

……まあ、イジらないと記事が書けないわけですが。

ではでは、新規投稿記事を作って、Gutenberg エディターを見てみましょう。
新規記事、オープン!

おおお、誰だいキミ?

確かにかなり変わりましたね。
全体的にフラットなデザインになりました。

中央に大きく
タイトル欄
本文欄
サイドバーには
公開設定枠
カテゴリー、タグ設定枠
アイキャッチ画像設定枠
抜粋設定枠
ディスカッション(コメント)設定枠
などが並んでいます。
(エディターは日本語化が遅れているようですね。日本語と英語が混在しています)

この中で特に注目なのは「Document(公開設定枠)」ですね。
タブの形になっていて、「Block(ブロック)」なる謎の要素が加わっています。

こちらのブロック、本文欄の方と連携しているようで、
本文の方で「Blcok」要素を設定すると、サイドバーの方に内容が表示されます。
サイドバーは詳細な設定を行うための「プロパティ画面」という感じですね。

では……試しに何かブロックを設定してみましょうか。
本文欄の横に出てくる「+マーク」をクリックすると、ポップアップが出てきました。

こちらは「ブロック一覧」です。

「文章」とか、「画像」とか、「テーブル」とか、本文に加えたいものを選びます。
今回は「Image(画像)」のブロックを設定してみましょう。

すると、本文欄に「画像のブロック(枠)」が出てきます。
画像は「アップロード」したり、「メディアライブラリ」から選んだりできるようです。

では、前回の記事で使ったコロボ君の画像を「メディアライブラリ」から選んで、と。

はい、ブロック(枠)の中にコロボ君が表示されました。
これが、ブロックを設定する流れです。

ちなみにこのブロック、設定した後から、
「ドラッグ&ドロップ」で場所を入れ替えることや、
「設定丸ごと複製する」ことができるようになっています。

中でも特徴的なのが、「Columns(カラム/列)」のブロックです。
これは、何かを表示するためのブロックではなく、「ブロックを整理整頓するためのブロック」なのです。

……サッパリだと思いますので、実際にやってみましょう。

まずは本文欄に「カラムのブロック」を設置して、と。
そのカラムブロックの中に出てくる「+マーク」から、今度は「画像ブロック」を置きます。

カラムと言うだけあって、このブロックにはあらかじめふたつの列が存在していますので、
もうひとつの列にもある「+マーク」を押して、こちらにも「画像ブロック」を置きましょう。

そうすると、こんな感じになります。
透明なカラムが2列分あって、その中に各々画像ブロックを配置した、というイメージですね。

実際にWebサイトで見てみても、ちゃんと画像が並んでいます。
コロボ君、瞬きー!

この機能を使うことで、
単純に上から下にブロックを並べるだけではなく、
にもブロックを並べることができるようになるわけです。
工夫次第で色々なレイアウトができるようになりそうですねー。


さてさて!

WordPress 5.0とGutenberg エディター、いかがでしたか?
雰囲気的には、「ページビルダー系のプラグイン」に近付いている感じがします。
(ページビルダー系のプラグインって何?という方は、こちらをどうぞ!

標準機能側が、最先端のビルダーの要素を取り入れ始めた、ということなのでしょうかね。
(制作チームは、「まだまだこのエディターを発展させます!」と言っていますし)

とは言え、使ってみた感じとしては、
ページビルダーに慣れていない人からすると、動きがなかなか……独特ですので、
しばらくは今までどおりテキストエディターを使っていく方が良さそうな気がします。

ワタシ的には「下書きとして保存」ボタンを押す度にGutenberg エディターに戻ってしまうのが困りものです。
わかった、わかったから、便利なのは。ちょっと後ろに下がってくれるかしら。

【感想】
新しもの好き!という方でなければ、
もう少しバージョンが上がるのを待っても……いいかもしれませんね。

以上「WordPress 5.0バージョンアップレポート」でした。
当「さるでき.com」は、(不可抗力により)本日から「WordPress 5.0」で元気に運用しております♪