Tag: Gutenberg

  • WordPressの新エディタ「Gutenberg」を使ってみた。

    WordPressの新エディタ「Gutenberg」を使ってみた。

    6/21,22に京都で開催されたWordCamp Kyoto 2017に参加して、様々なセッションを聞いてきました。新しい発見がたくさんあったのですが、その中でも衝撃的だったのが、年内に実装を目指しているというWordPressの新エディタ「Gutenberg」です。

    現在、ベータ版がプラグインとして公開されているということでさっそく使ってみました。話を聴いているときも凄いと感じたのですが、実際使うと本当に凄いです。

    WordPress標準搭載予定の新エディタ「Gutenberg」

    「Gutenberg」とは、現在開発進められているWordPressコアに搭載される予定のエディタのことです。開発のコンセプトは、htmlやショートコードを一切利用しなくても、ブログ記事をおもうがままに誰でも書けるようにすることを目指しています。

    これまでもWordPressはエディタの改善にいろいろと努めてきている訳ですが、実際にはhtmlを知らないとなかなか細かいカスタマイズはできないですし、記事中の写真などの挿入はなかなかに面倒なものがありました。

    実際、私もブログの執筆の際にはサードパーティ製のエディタ「MarsEdit」が手放せません。ですが、この状況が「Gutenberg」の登場で一気に変わる予感がするのです。

    実際に記事を書いてみた

    現在、公開されているベータ版のプラグインを導入するとダッシュボードのメニューの下の方に「Gutenberg」と出てきます。現段階では新規投稿とデモのみです。デモ画面では、実際に使った場合の感じを掴むことができます。

    Gutenberg plugin

    新規投稿を選択したら、タイトルを入力欄にいれていきます。

    Title insert

    入力するこんな感じです。

    Title in

    小見出しの入力で、コードを打ち込む必要はありません。

    Sentence title

    続いては写真の挿入。insertアイコンをクリックすると候補がでてきます。写真だけでなく、引用や、Twitterの埋め込み、Youtubeなど一取りもものを簡単に挿入することができます。

    Insert photo0

    写真はメディアライブラリから簡単に挿入できます。

    Insert photo1

    文章は節ごとに分けてかき、左側のアイコンで順番を入れ替えたり、右側のゴミ箱アイコンで簡単に削除することができます。

    Sentence block

    既存記事の更新は、投稿一覧のページから「Gutenberg」を選択すればOK。既存のエディタも選択できます。

    Update post

    ノンコーディングでさくさくかける

    使用する前の使用感の予想としては、MicrosoftのWordみたいな感じになることを目指してるのかなと考えたのですが、実際はちょっと違う感じでした。使い慣れればそれよりも書きやすいかもしれません。

    今回、簡単な記事を「Gutenberg」で書いてみましたが、HTMLのコードは意識せずに書くことができました。このまま開発がすすめば、本当に素晴らしいエディタになりそうです。

    ただ、IT業界に長く関わっている経験からいけば、こういうツールはここ一番微調整が難しく結局コードを読まないといけなくなったり、変なバグが入っていてそのせいでせっかくの機能が台無しになっているなんてことが結構あるので、慎重にすすめて欲しいところでもあったりします。

    少なくとも今回使った感じでは、これが本当に実装されれば、私が利用している「MarsEdit」のようなサードパーティ製のエディタは間違いなく不要になるでしょう。WordPressの開発チームの皆さんの頑張りに期待します。

    今日のアクション

    「Gutenberg」のプラグインはまだベータ版のため、本番環境で利用しないようにアナウンスが出ています。必ず守るようにして下さい。私も自分で持っているテスト環境で動かしています。今後の開発に期待です。

    Gutenberg