WordPressブロックエディターの3つのメリットと活用方法

WordPressの新しいブロックエディター「Gutenberg(グーテンベルグ)」

その存在は知っているものの旧クラシックエディターに慣れすぎて、新しいブロックエディターを使う気にならない・・という人もまだ多いようですが、実際に使ってみるとその利便性に驚かれると思います。

私もここ最近になって使い始めたのですが、もうブロックエディターなしではブログやWebサイトのコンテンツ作成はあり得ないと言うレベルになっています。

本日は

新しいブロックエディターってどんな点が良いの?
サイト運営における活用方法を知りたい!

新しいブロックエディターを使った具体的な表示例が見たい!

そんな方に向けて記事を書きましたので参考にしていただけたら幸いです。

メリット1「ブロックに分けてコンテンツを管理することができる」

ブロックエディターと言う名の通り、1つのコンテンツの中の構成(パーツ)をまるでブロックを積み上げたり、入れ替えたりすることができる点が、非常に便利です。

▼ 下記動画参照

旧エディタでは、1つの枠の中にいくつもの構成(パーツ)を詰め込んでいたイメージだったため、1つ1つのパーツの管理という意味では難しい面がありました。

また大きな枠の中でなぜか変なタグが入ってしまったりしてソースコードが汚くなることもあり、すなわちSEO的な観点からもよろしくありませんでした。

しかしながら新しくなったブロックエディター「Gutenberg(グーテンベルグ)」では、1つ1つのブロック毎に要素を設定できるため、そういったことがありません。

ブロックを積み上げる・入れ替える、ブロック毎に要素を設定するといった概念は実際に使ってみないと分からないと思いますので、ぜひWordPressのブロックエディター「Gutenberg(グーテンベルグ)」を使い込んでみてください。

メリット2「ブロック毎の設定が便利」

メリット1でも少し触れましたがブロック毎に設定ができる点がすごく便利です。

下記の動画では3つのテキストブロックにそれぞれ違う設定を施していったものですが、1つの大きな枠の中でやるのと、それぞれ分かれたブロックでやるのではその利便性の違いがイメージできるかと思います。

メリット3「レイアウトの問題が解消」

これは私が2006年頃からWebサイトの制作側に携わっていたからこそ感じるメリットかもしれませんが、「専門知識がなくとも自由なレイアウトでサイトを作り、運用管理できる」点がすごく良いと感じました。

WordPress ブロックエディタ Gutenberg グーテンベルグ レイアウト要素
WordPressのブロックエディター「Gutenberg(グーテンベルグ)」「レイアウト要素」

例「レイアウト要素」

WordPressのブロックエディター「Gutenberg(グーテンベルグ)」では「レイアウト要素」と言うものがあるのですが、その中の「カラム」を使うことでコンテンツエリアを2カラム、3カラム、4カラムと言った感じで、HTMLやCSSの知識がなくともカラム分けしたレイアウトを作ることができます。

※下記カラム例はPCのみ表示

2カラムでの表示例(画像-画像)

2カラムでの表示例(画像-テキスト)

埼玉県川越市の小江戸メイン通り

土日になると非常に賑わいを見せる埼玉県川越市にある「小江戸」

風情ある通りを歩きながらの食べ歩きが楽しくとても人気の街。

3カラムでの表示例(画像-画像-画像)

その他レイアウトの具体的な表示例などは、こちらのページにて紹介していますので参考にしていただければ幸いです。

制作サイドのメリット

レイアウトの問題は専門知識がないとなかなか実現することができなかった問題でしたので、利用する方だけでなく、お客様にWebサイトを提供する制作サイドにとっても素晴らしいメリットのひとつだと思います。

なぜならお客様の望むレイアウトを実現させるには、WordPressのカスタムフィールドなどの機能を用いなければ実現させられなかったため、要望を実現させるには当然ながらコストがかかります。

予算があれば問題ありませんが、予算がない、そしてHTMLやCSSの知識もない方の場合、教育コストや問題が起きた際の対応コストも発生します。

こうした見えないコストが制作サイドにとって大きな負担となっていましたからね。

ブロックエディターを活用しきれないケース

新しくなったブロックエディターのメリットを私なりに解説いたしましたが、活用しきれないケースもあると感じています。

それは大手や中堅企業などで、上司や会社の許可なく担当者が自由にサイトを更新できない場合です。

こうした規模感の企業では、ブロックエディターは使用せず、カスタムフィールドなどの機能を用いてカスタマイズを行い、あえてレイアウトに制限をかけて制作し対応しています。

よってブロックエディターの利便性の恩恵を受けるのは、個人や個人事業主、小規模事業主など言わば自分自身にブログやWebサイトの方針を決める決裁権のある人や企業と言えるでしょう。

さいごに

「ブロックエディター使いづらい」と言う方へ

新しくなったブロックエディターの出た当時(約1年ほど前)の頃は、私も旧エディタに慣れていたこともあり、すごく違和感を感じて使用していませんでした。

便利過ぎて手放せない今でも感じることは、「ファーストビューが素っ気なく使う気にならない」と言う印象の問題もあるのかな?と思います。

そういった言わば「食わず嫌い」の状態の方は是非新しくなったブロックエディターを使い込んでみてください。

使い込むことでUIにも慣れていきますし、利便性の高さを実感していくことができると思います!

どうしてもクラシックエディタに戻したいと言う方は

個人的には非常に利便性が上がったと感じているブロックエディタ ーですが、「いやいやクラシックエディターの方が使いやすいよ」「元に戻したいんだけど・・」と言う方は、プラグイン「Classic Editor」を入れれば速やかに旧エディタに戻すことができますので補足しておきます。

各種ブロックの具体的な表示について

各種ブロックの具体的な表示は、こちらの記事にて紹介していますので参考にしていただければ幸いです。

この記事を書いた人

浅賀理生(あさかまさお)

株式会社インスパイアデザイン代表。釣りとコーヒーをこよなく愛する家族LOVEな二児のパパ。WordPressを用いたWeb制作&開発のご相談はお気軽にどうぞ