Gutenberg のカスタムブロックを勉強するためにインストールした Advanced Gutenberg プラグインが予想以上に便利だった

僕が作って配布している WordPress 公式テーマ Nishiki を Gutenberg に対応したので、次は「テーマ専用のブロックを作ろうかな〜」と思って、巷の Gutenberg 関連の情報を探していたら・・・ Advanced Gutenberg という、すごくいいプラグインがあることを知りました。

投稿や固定ページの本文内でこんなことができる

これまで WordPress の投稿や固定ページの本文内で少し手の込んだことをしようとすると、途端に難易度が高くなってしまった経験はありませんか。

例えば、本文内で「タブコンテンツ」を作りたいとします。

色々とやり方はありますが、HTML や JavaScript などのコードを書いたり、ショートコードを作ったり、テンプレートファイルを作ったりなど・・・手間をかけている方も多いと思います。

そこで、Advanced Gutenberg プラグインの Tabs ブロックを使えば、以下のようなタブコンテンツを感覚的に作ることができます。

タブの追加・削除などが感覚的にできるのはかなり嬉しい機能ですね

というわけで、作れるのはタブコンテンツだけではなく、いろんなブロックが用意されています。詳しくは下のデモ動画がとてもわかりやすいです。

Advanced Gutenberg プラグインにはいろんなブロックが用意されていて「どれも使うな〜」なんて思いながらいくつか触ってみましたが、カウントアップやGoogle MAP の埋め込みなどは、かなり使えそうだなと思います。

カウントアップ

こういうコンテンツを入れたい時ありませんか。僕はあります

Google MAP

Google MAPの埋め込みブロックは強力ですね・・・緯度・経度 または 住所でマーカーの場所を指定したり、地図の拡大・縮小や、表示領域(高さ)の調整、マーカーアイコンの変更もできます。

投稿や固定ページでお店やランドマークまでの案内を載せる際に活躍しそう

コンテンツ作りの手間が減らせるかも

このプラグインを使用することで、投稿や固定ページの本文内で複雑な部類のコンテンツ作りをしたい場合、手間が減る可能性は十分にあります。

デザインをちょっと変えてみよう

ブロックを追加できるのはとても便利なんだけど「使用しているテーマとブロックで作ったコンテンツのデザインがちょっと合わない」と思う方もいらっしゃると思います。

もし、使用しているテーマに合ったデザインを希望する場合は WordPress の管理画面→「Adv.Gutenberg」のページである程度調整できると思います。こんな画面も用意されているなんて、多機能すぎる・・・

やる気出ました

というわけで、冒頭の「テーマ専用のブロックを作ろうかな〜」という話に戻るのですが、ただいま Nishiki テーマ専用ブロックを作っている最中です。

今回ご紹介したプラグインも参考にしながら、使えるブロックを一通り揃える予定ですが・・・もし「WordPress テーマ Nishiki の投稿や固定ページの本文内で、こんなことしたいよ!だからブロック作って!」など要望がありましたら、ユーザーコミュニティ内でお伺いしますので、どんどんお寄せください。

いいプラグインを知って、やる気が出ました!

参考リンク

著者:bouya Imamura