Block Editorで画面の操作説明記事を素早く書くためにオススメな2つの機能

さて、WordPressの5.0より導入された、BlockEditor（以下ブロックエディター）ですが、使われてますか？実際使い始めると、投稿もしやすいですし、たくさんの素敵なブロックが開発されてて、すごく便利だなーと感じています。

前回の記事(AMPでGTM経由でAnalyticsを設定する)を書いたのですがこういった、手順的な操作説明記事をササッと手早く書きたい！というときに便利な機能のご紹介です。

1. リストと見出しをmarkdown記法で呼び出す

基本的に見出しと本文という連続になります。そして、本文中にはリストを利用することもよくあります。これらを利用するときにはmarkdown記法的な入力で、サクッと表現できます。

見出しを書きたい場合は、文頭に半角で#を打てば、見出しにとなります。

リストを書きたいときは文頭で-を入力すれば通常のリストになりますし、1. を入力すれば、数字リストになりますね便利便利。

技術画面のキャプチャを何枚か貼り付けながら、説明するときに、従来は都度都度パソコンにキャプチャ画像を保存した後、WordPressにアップロードしていました。数が多くなるととても手間でした。でもそれがブロクエディターによって不要になりました！！やったぜ。

やり方も簡単です。macであればcontrol+shift+command+4 で範囲を指定して、クリップボードにコピーした後、control+V でエディターに貼り付けるだけです。これで画像のアップロード完了です。便利！

最近のサービスだと割と実装されている機能ですがWordPressでも使えますよー。という感じです。半分ぐらいの時間に短縮されている気がしますし、なにより、作業しながら本文を書き進めるときのストレスが大幅に軽減されています

画面を任意の大きさでクリップボードにコピーしたら貼り付けるだけでアップロードされる

というわけで、すくなくとも私はこれまでのエディターよりも手早く、作業を進めることができました。ブロックエディター素敵！ということで今後もつかっていきます。

ここから先はオマケ的なものです。

ひとまずcontrol+option+H でキーボードショートカットの一覧がひらくので見てみてくださいませ。

キーボードショートカットたくさん

なかでも太文字やリンク設定するためのショートカットは便利な気がしています。これもあまり考えずになんとなくキーボードを押せば、思うようになるので助かっています

画像のパララックス的な表現もブロックと幅をしていするだけで可能です。いままでのClassic Editorだと、HTMLを書かないと行けないケースがおおかったので、嬉しい限りです。

こちらは画像が横にあるパターンですね。こういうのもやろうと思うと、HTMLで書くか、何かしらカスタムフィールドを準備するかなどなどがひつようだったので、ランディングページなどはとても作りやすくなった印象です。

こちらはメディアと文章ブロックを利用しています。

ということで、使えば使うほど便利になりますし、基本機能だけでも十分に素敵なブロックエディター。ぜひぜひ使ってみてくださいませ。そしてなにかしら良い機能があれば教えて下さいー。