WordPressのブロックエディタの使い方【この記事だけでOK】

2018年にWordPress5.0のリリースとともに、導入されたブロックエディタのGutenberg(グーテンベルク)。

便利なブロックエディタですが、使い方がイマイチわからないという理由から、クラシックエディタを使い続けている人も多いのではないでしょうか。

ただクラシックエディタは2021年を持って終了される予定で、かつクラシックエディタで書いた記事をブロックに変換すると、若干レイアウトが崩れたりと不便なこともあるので、早めにブロックエディタに乗り換えることがおすすめです。

この記事では、ブロックエディタの使い方について、動画つきで解説していきたいと思います。

ブロックエディタ「Gutenberg(グーテンベルク)」とは？

ブロックエディタ「Gutenberg(グーテンベルク)」はクラシックエディタに比べて、誰でも簡単に直感的な操作で記事が書けるエディタとなっています。

クラシックエディタに慣れている方は最初は戸惑うかもしれませんが、慣れてしまえばクラシックエディタより数倍使いやすいです。

ブロックエディタの使い方

タイトル、文章を書く

タイトル、文章はシンプルに書くことができます。

見出し

見出しを選択肢、見出しレベルを変更します。

文字色をつける

文字色をつけるにはブロック単位で色をつけるパターンと、文字単位で色をつけることができます。

＜ブロック単位で色をつける方法＞

＜文字単位で色をつける方法＞

改行

ブロックエディタではブロックを開けただけでは空行になりません。

ブロックエディタでは「スペーサー」を選択することで空行を作ることができます。

画像挿入

画像挿入はクラシックエディタ同様、メディアライブラリから追加するほか、ドラックして直感的に追加することもできます。

＜メディアライブラリから追加する方法＞

＜ドラックして追加する方法＞

リスト

リストも簡単に設定できます。

ブロック再利用

クラシックエディタにはブロック再利用という機能があります。

よく使う挨拶などを再利用ブロックに追加しておくと、いつでもボタン1つで設定することができます。

ショートコード

各WordPressテーマに設定されているショートコードを設定します。

HTMLでの編集

HTMLで修正することもできます。

吹き出し、枠線

吹き出しは標準機能としては搭載されていないため、ショートコードやテーマに搭載された機能で対応することなります。

ショートコードで実装

クラシックエディタでショートコードで吹き出しを実装していた場合は、ブロックを「ショートコード」に変換し、入力します。

よく使う場合は、ブロック再利用に追加しておくと良いでしょう。

テーマで実装

テーマで吹き出し機能が搭載されている場合、それを利用するのが一番楽です。

SWELLであれば、吹き出しを事前に吹き出しのパターンを登録しておき、呼び出すことができます。

リンク

リンクはテキストリンク、アフィリエイトリンク、ボタンへのリンクに分けて解説します。

テキストリンク

テキストリンクはテキスト部分をドラックして、リンクをクリックすれば設定できます。

アフィリエイトリンク

アフィリエイトリンクはASPでリンクを生成したリンクを「カスタムHTML」に変換したブロックに貼ることで実装できます。

ボタンへのリンク

クラシックエディタでショートコードで吹き出しを実装していた場合は、ブロックを「ショートコード」に変換し、入力します。

よく使う場合は、ブロック再利用に追加しておくと良いでしょう。

下記参考として、SWELLの場合のボタン設定機能となります。

ワンタッチでキラッと光るボタンがセットできます。

埋め込み（Twitter、Youtubeなど）

URLを指定するだけで簡単に埋め込みができます。

アイキャッチ

アイキャッチは画像をドラックするだけで設置可能です。

まとめ

今回はブロックエディタについて解説してきました。

僕は、ブロックエディタを使い始めるタイミングで、ブロックエディターへの機能が充実しているテーマに変更しました。

毎日使うことを考えるとコスパ的にも断然おすすめです。