Gutenbergが使いやすくなるおすすめプラグイン10選【ブロック拡張系】
このような要望にお応えします。
- Gutenbergが使いやすくなるおすすめWordPressプラグイン10選
今回は、Gutenbergが使いやすくなるおすすめプラグインを10コ紹介します。
紹介するプラグインを導入すれば、今より使えるブロックの数を格段に増やすことができます。
結果として、読者に読みやすい記事だと思ってもらえるようになりますよ。
Gutenberg対応のおすすめWordPressテーマ7選【ブロックエディター】
Gutenbergにおすすめなブロック拡張系プラグイン10選【WordPress】
Gutenbergが使いやすくなるブロック拡張系プラグインは、下記の10コです。
- Snow Monkey Blocks
- Advanced Gutenberg
- GETWID BLOCKS
- Stackable – Gutenberg Blocks
- Ultimate Addons for Gutenberg
- Kadence Blocks
- Useful Blocks
- Arkhe Blocks
- VK Blocks
- Editor Blocks for Gutenberg
それぞれのプラグインについて紹介していきますね。
【おすすめプラグイン①】Snow Monkey Blocks
Gutenbergにおすすめなブロック拡張系プラグイン1つ目は「Snow Monkey Blocks」です。
Snow Monkey Blocksで追加できるブロックは全部で24種類あり、どれも便利なブロックばかりです。
Snow Monkey Blocksをインストールすれば、装飾で困ることはなくなりますよ。
Snow Monkey Blocksは「Snow Monkey」というテーマ用のプラグインなのですが、Snow Monkey以外でも使えますのでご安心ください。
Snow Monkey Blocksで追加できるブロックは下記の表にまとめましたので、よければ参考にしてみてください。
| アコーディオン | クリックで開閉ができるアコーディオンメニューを実装するためのブロック |
|---|---|
| アラート | 読者に注意をうながすためのブロック |
| 吹き出し | 会話を表現する時に使うブロック |
| ボックス | 文章を枠線で囲うためのブロック |
| ボタンボックス | マイクロコピー付きのボタンを設置するためのブロック |
| ボタン | 普通のボタンを設置するためのブロック |
| カテゴリー一覧 | サイトの中にあるカテゴリーをすべて表示するためのブロック |
| コンテナ | 画面幅からはみ出ないように囲うためのブロック |
| カウントダウンタイマー | 設定した日付までのカウントダウンを表示するためのブロック |
| ディレクトリ構造 | ディレクトリ構造を表現したい時に使うブロック |
| 星評価 | 星で評価を表す時に使うブロック |
| FAQ | Q&Aを作るためのブロック |
| 項目 | コンテンツを並べるためのブロック |
| 期間限定の表示 | 設定した日時にだけ表示されるブロック |
| アイコンリスト | アイコンを使ったリストブロック |
| メディアと文章 | メディアと文章を横並びに配置するためのブロック |
| パネル | パネルのようにコンテンツを並べるためのブロック |
| 価格メニュー | 商品の価格を表示するためのブロック |
| 価格表 | 商品のCTAを設置するためのブロック |
| レーティングボックス | 評価をレーティングで表すためのブロック |
| ピックアップスライダー | コンテンツに「pickup」のラベルを貼りつけたスライダーを実装するためのブロック |
| スライダー | 通常のスライダーを実装するためのブロック |
| ステップ | ステップ形式のコンテンツを作るためのブロック |
| お客様の声 | お客様の感想やレビューを記載するためのブロック |
【おすすめプラグイン②】Advanced Gutenberg
Gutenbergにおすすめなブロック拡張系プラグイン2つ目は「Advanced Gutenberg」です。
Advanced Gutenbergでは全部で22コのブロックを追加できますので、Gutenbergの装飾を大幅に広げられます。
個人的におすすめだと感じるブロックは、下記の3つですね。
- タブブロック
- スライダーブロック
- お知らせブロック
Advanced Gutenbergはプラグインのダウンロードページを見ても星5の評価が多いです。
海外製のプラグインですが、安心して使うことができると思います。
Advanced Gutenbergで追加できるブロックは下記の表にまとめましたので、よければ参考にしてみてください。
| Advanced Accordion | クリックで開閉ができるアコーディオンメニューを実装するためのブロック |
|---|---|
| Advanced Button | ボタンを設置するためのブロック |
| Advanced Icon | 様々な種類のアイコンを作成するためのブロック |
| Advanced Image | 画像を挿入するためのブロック。なお、画像上に文字を載せることや画像をリンクに設定することも可能 |
| Advanced List | 様々なアイコンを使ったリストブロック |
| Advanced Table | 表を作るためのブロック |
| Advanced Tabs | タブをクリックすると内容が切り替わる、タブコンテンツを作るためのブロック |
| Advanced Video | 動画を挿入するためのブロック |
| Culumns Manager | 様々な種類のレイアウトを実装するためのブロック |
| Contact Form | お問合せフォームを作るためのブロック |
| Count Up | カウントアップ形式で数字を表示させるブロック |
| Images Slider | 画像のスライダー |
| Info Box | 読者にお知らせがある場合に使うブロック |
| Login/Register Form | WordPressへのログインフォームを設置するためのブロック |
| Maps | Mapを表示するためのブロック |
| Newsletter | メルマガの登録フォームを設置するためのブロック |
| Recent Posts | 最近の投稿を表示するためのブロック |
| Search Bar | サイト内検索を行うための検索窓を設置するためのブロック |
| Social Links | サイトとSNSを繫ぐためのSNSボタン |
| Summary | 目次を表示するためのブロック |
| Testimonial | ユーザーの感想やレビューを掲載するためのブロック |
| Woo Products | ネットショップの商品を掲載するためのブロック |
【おすすめプラグイン③】GETWID BLOCKS
3つ目のプラグインは「GETWID BLOCKS」です。
GETWID BLOCKSでは39種類ものブロックを追加できますので、標準のGutenbergよりも確実に使いやすくなります。
また、それぞれのブロックはサイドバーから細かくカスタマイズできますので、独自性の高い装飾ができますよ。
GETWID BLOCKSで追加できるブロックは、下記の表にまとめておきました。
| Section | 新しいセクションを追加するためのブロック（背景に画像を設定可能） |
|---|---|
| Advanced Heading | おしゃれな見出しを作るためのブロック（フォントをGoogleフォントから選べる） |
| Google Maps | Googleマップを追加するためのブロック |
| Icon | アイコンを挿入するためのブロック |
| Icon Box | アイコン+テキストのボックスを作成するためのブロック |
| Image Box | 画像+テキストのボックスを作成するためのブロック |
| Social Links | ソーシャルアイコンを挿入するためのブロック |
| Banner | 様々なタイプのバナーを作成するためのブロック |
| Image Slider | スライダーを作るためのブロック |
| Media & Text Slider | テキストを載せたスライダーを作るためのブロック |
| Button Group | 複数のボタンを作成するためのブロック |
| Person | 人物を紹介するためのブロック |
| Accordion | アコーディオンメニューを作成するためのブロック |
| Toggle | クリックで開閉するメニューを作成するためのブロック（アコーディオンメニューとほとんど同じ） |
| Tabs | タブコンテンツを作るためのブロック |
| Image Stack Gallery | ギャラリーを作成するためのブロック |
| Testimonial | お客様の声やレビューを追加するためのブロック |
| Recent Posts | 最近の投稿を表示してくれるブロック |
| Advanced Spacer | スペーサーを追加するためのブロック（スマホやPC表示だけ消すことも可能） |
| インスタのギャラリーを挿入するためのブロック | |
| Price Box | 商品のプランや価格を表示するためのブロック |
| Progress Bar | 棒グラフを追加するためのブロック |
| Circular Progress Bar | 円形グラフを追加するためのブロック |
| Contact Form | お問い合わせを追加するためのブロック |
| Post Carousel | カルーセル形式でランダムに投稿を表示してくれるブロック |
| Price List | リスト形式で価格を表示してくれるブロック（レストランのメニューのようなイメージ） |
| Post Slider | 投稿をスライダーで表示してくれるブロック |
| Custom Post Type | リストかグリッド形式でランダムに投稿を表示してくれるブロック |
| Mailchimp | MailChimpの登録用ブロック |
| Countdown | カウントダウンタイマーを設置するためのブロック |
| Video Popup | Youtubeなどの動画をおしゃれに表示するためのブロック |
| Content Timeline | タイムライン形式でコンテンツを表示するためのブロック |
| Image Hotspot | 画像の上にアイコンやツールチップを表示するためのブロック |
| Table of Contents | 目次を挿入するためのブロック |
| Advanced Table | テーブルを作成するためのブロック |
| Anchor | アンカー（リンク）を作成するためのブロック |
【おすすめプラグイン④】Stackable – Gutenberg Blocks
Gutenbergにおすすめなブロック拡張系プラグイン4つ目は「Stackable – Gutenberg Blocks」です。
Stackable – Gutenberg Blocksはブロックを追加できることはもちろんのこと、Stackableが用意したおしゃれなテンプレートをそのまま記事に複製することもできます。
Stackable – Gutenberg Blocksで追加できるブロックは全部で28種類あり、それぞれのブロックの使い方は下記の表で紹介しています。
| Accordion | クリックで開閉できるアコーディオンメニューを実装するためのブロック |
|---|---|
| Blockquote | 他サイトから情報を引用する時に使うブロック |
| Posts | サイト内の記事を新しい順に掲載するためのブロック |
| Button | ボタンを設置するためのブロック |
| Call to Action | CTAを設置するためのブロック |
| Card | ポストカードのようなコンテンツを作成するためのブロック |
| Advanced Columns&Grid | 様々な形式のレイアウトを実装するためのブロック |
| Container | コンテンツを囲うためのブロック。枠線をつけたり背景色を変えることも可能 |
| Count Up | カウントアップ形式で数字を表示するためのブロック |
| Design Library | Stackableが用意したデザインの中から好きなレイアウトを選び、そのままの形で再現するためのブロック |
| Divider | ページ内の区切り線を引くためのブロック |
| Expand/Show More | 「もっと読む」を設置し、ブロック内の文章を省略して表示するためのブロック。「もっと読む」をクリックすると、省略した文章の全文が表示される |
| Feature Grid | おしゃれなレイアウトを実装するためのブロック |
| Feature | 目を引くようなコンテンツを作るためのブロック |
| Header | サイトのヘッダー部分を作るためのブロック |
| Advanced Heading | おしゃれな見出しを作るためのブロック |
| Icon List | アイコンを使ったリストブロック |
| Icon | アイコンを設置するためのブロック。リンクを設定することも可能 |
| Image Box | 画像を挿入するためのブロック。ギャラリーのように表示することも可能 |
| Notification | 読者への注意をうながすためのブロック |
| Number Box | 順番付きのコンテンツを作成し、様々なレイアウトを組むためのブロック |
| Pricing Box | 商品の値段を表記するためのブロック |
| Separator | コンテンツとコンテンツを分ける時などに使う、ユニークなセパレーターを作成するためのブロック |
| Spacer | ブロックとブロックの幅を調整するためのスペーサー |
| Team Member | 複数人のプロフィールを作成するためのブロック |
| Testimonial | ユーザーの感想やレビューを掲載するためのブロック |
| Advanced Text | 普通の段落。レイアウトを変えることが可能 |
| Video Popup | 動画を挿入するためのブロック。動画を再生するとポップアップのように表示することも可能 |
【おすすめプラグイン⑤】Ultimate Addons for Gutenberg
Gutenbergにおすすめなブロック拡張系プラグイン5つ目は「Ultimate Addons for Gutenberg」です。
Ultimate Addons for Gutenbergがおすすめなポイントは、構造化データを簡単にマークアップできることです。
その点、Ultimate Addons for Gutenbergを使えばコードをいじることなく構造化データを記述できますので、誰でも簡単に構造化データをマークアップできます。
Ultimate Addons for Gutenbergは構造化データをマークアップするためだけにも、インストールしておくのがおすすめです。
追加できるブロックの使い方は下記の表で紹介していますので、よければ参考にしてみてください。
| Advanced Heading | 目を引くようなおしゃれな見出しを作成するためのブロック |
|---|---|
| Post Grid | サイト内の投稿を新規投稿から順番に表示してくれるブロック |
| Post Masonry | サイト内の投稿をレンガを積み上げるように掲載してくれるブロック |
| Post Carousel | サイト内の投稿をカルーセル形式で表示してくれるブロック |
| Section | コンテンツを囲うためのブロック |
| Multi Buttons | 複数のボタンを設置するためのブロック |
| Info Box | サイトの情報を掲載し、ユーザーを案内するためのブロック |
| Testimonial | ユーザーの感想やレビューを掲載するためのブロック |
| Team | 複数人のプロフィールを表示するためのブロック |
| Social Share | SNSで記事を拡散するためのボタンを設置するブロック |
| Google Maps | Googleマップを設置するためのブロック |
| Icon List | 様々なアイコンを使ったリストブロック |
| Price List | 商品と値段をリスト形式で表示するためのブロック |
| Content Timeline | コンテンツを時系列順に表示するためのブロック |
| Post Timeline | サイト内にある投稿を時系列順に表示するためのブロック |
| Call To Action | CTAを設置するためのブロック |
| Advanced Columns | 様々なレイアウトを組むためのブロック |
| Blockquote | 他サイトから情報を引用する時に使うブロック |
| Marketing Button | ボタンを設置するためのブロック |
| Table of Contents | 目次を作成するためのブロック |
| How-to Schema | How-toコンテンツをSchemaを使ってマークアップ |
| FAQ-Schema | FAQコンテンツをSchemaを使ってマークアップ |
| Inline Notice | ユーザーに通知や注意をうながしたい時に使うブロック |
| WP-Search | サイト内検索を行うための検索窓を設置するためのブロック |
| Taxonomy List | コンテンツを分類分けする時に使うブロック（カテゴリーを表示する時によく使われる） |
【おすすめプラグイン⑥】Kadence Blocks
6つ目のプラグインは「Kadence Blocks」です。
Kadence Blocksでは15種類のブロックを追加できるのですが、それぞれのブロックをかなり細かくカスタマイズできます。
例えばボタンの場合、下記のカスタマイズが可能です。
- フォントサイズ
- ボタンのサイズ
- ボタンの色
- 影の有無
- 枠線の太さ
ちなみにブログを運営している場合には、インフォブロックが便利です。
というのも、Kadence Blocksのインフォブロックは様々な装飾ができるので、ボックス系の装飾はインフォブロック1つで解決してしまうからですね。
Kadence Blocksで追加できるブロックは下記の表にまとめておきましたので、よければご活用ください。
| Row Layout | 様々なレイアウトを作るためのブロック |
|---|---|
| Tabs | タブコンテンツを作るためのブロック |
| Info Box | カスタマイズ性の高いナビゲーションボックスを作るためのブロック |
| Countdown | カウントダウンタイマーを作るためのブロック |
| Posts | 任意の投稿を挿入するためのブロック（カスタマイズ性が高い） |
| Table of Contents | 目次を挿入するためのブロック |
| Form | お問い合わせフォームを挿入するためのブロック |
| Advanced Gallery | カスタマイズ性の高いギャラリーを作成するためのブロック |
| Accordion | アコーディオンメニューを作成するためのブロック |
| Testimonials | お客様の声やレビューを書くためのブロック |
| Advanced Button | カスタマイズ性の高いボタンを作成するためのブロック |
| Icon List | アイコンを使ったリストを挿入するためのブロック |
| Spacer Divider | レスポンシブ対応のスペーサーを挿入するためのブロック |
| Icon | アイコンを挿入するためのブロック（1500種類以上） |
| Advanced Heading | 見出しを挿入するためのブロック |
【おすすめプラグイン⑦】Useful Blocks
おすすめのプラグイン7つ目は「Useful Blocks」です。
Useful Blocksでは追加できるブロックは少ないものの、他のプラグインにはないようなブロックが用意されています。
気に入ったブロックがある場合には、ぜひインストールしてみてください。
まずは無料版を使って、機能を拡張したいと思ったらUseful Blocks PROに移行する流れが理想的ですね。
Useful Blocksで追加できるブロックは、下記のとおりです。
| CVボックス | 商品を紹介するためのボックス |
|---|---|
| 比較ボックス | 2つのものをリスト形式で比較するボックス |
| アイコンボックス | ボックスの中にアイコンを表示したブロック |
| 棒グラフ | 棒グラフを作成するブロック |
| 評価グラフ | 任意の項目を5段階評価で表示するためのブロック（PRO版では3段階評価も可能） |
【おすすめプラグイン⑧】Arkhe Blocks
ブロック拡張系プラグイン8つ目は「Arkhe Blocks」です。
Arkhe Blocksも追加できるブロックが少なめのプラグインです。使ってみたいブロックがある場合には、ぜひお試しください。
Arkhe Blocks PROに興味がある場合には、公式サイトでご確認ください。
Arkhe Blocksの公式サイト
Arkhe Blocksで追加できるブロックは、下記の表にまとめておきました。
| アコーディオンブロック | アコーディオンメニュー（プルダウン形式のメニュー）を作成するためのブロック |
|---|---|
| Q&Aブロック | Q&A形式のコンテンツを作るためのブロック |
| 説明リスト | dl、dt、ddを使ったリスト |
| 通知ブロック | 様々なアイコンを使ったボックスを作るためのブロック（アイコンの種類はサイドバーから変更可） |
| セクションブロック | 新しいセクションを作るためのブロック（背景には画像や動画を設定可能） |
| セクション見出しブロック | 見出しだけのセクションを作るブロック |
【おすすめプラグイン⑨】VK Blocks
Gutenbergにおすすめなブロック拡張系プラグイン5つ目は「VK Blocks」です。
VK Blocksは追加できるブロックの数が12コと少ないものの、ブログではよく使うブロックが多いです。
したがって、必要なブロックだけを追加したい人にはおすすめのプラグインですね。
プラグインをインストールしてからすぐに使いこなせるはずです。
ブロックについては下記の表にまとめましたので、よければ参考にしてみてください。
| スタッフ | プロフィールを作成するためのブロック |
|---|---|
| 見出し | 見出しを作成するためのブロック |
| アラート | ユーザーに注意をうながしたい時に使うブロック |
| 吹き出し | 会話を表現する時に使うブロック |
| ボタン | ボタンを設置するためのブロック |
| 旧FAQ | FAQを設置するためのブロック（新FAQが用意されているため、旧FAQを使う頻度は少ない） |
| フロー | コンテンツに流れをもたせたい時に使うブロック |
| PR Blocks | 複数のPRを行う際に使うブロック（PRポイントを列挙する場合や複数の商品を紹介する場合に使用） |
| PR Content | 1つのPRを行う際に使うブロック（1つのPRポイントアピールしたい場合や1つの商品を紹介する場合に使用） |
| 枠線ボックス | 文章を囲うためのブロック（様々な装飾が用意されているため、使用頻度は高め） |
| 新FAQ | FAQを設置するためのブロック（有料版ではアコーディオンメニューを実装可能） |
| レスポンシブスペーサー | デバイスごとに余白の大きさを調節できるスペーサー |
【おすすめプラグイン⑩】Editor Blocks for Gutenberg
最後に紹介するプラグインは「Editor Blocks for Gutenberg」です。
Editor Blocks for Gutenbergはブログというより、コーポレートサイト向けのブロックを追加できるプラグインです。
追加できるブロックの例をあげると、下記のとおり。
- 商品の価格を表示するためのブロック
- CTAを設置するためのセクションブロック
- メンバーを一括表示するためのブロック
Editor Blocks for Gutenbergを使えば、企業の記事も簡単に作成できますよ。
Editor Blocks for Gutenbergで追加できるブロックは下記の表にまとめておきましたので、よければご確認ください。
| Wrapper | ラッパー（セクション）を作るためのブロック |
|---|---|
| Author Profile Block | 筆者やプロフィールを挿入するためのブロック |
| Hero Block | 注目度の高いテキストを挿入するためのブロック（ラッパーと併用して使用） |
| Pricing Table Block | 商品の価格表を作成するためのブロック |
| Team Members Block | 集団のメンバーを一括表示するためのブロック |
| Testimonial Block | お客様の声やレビューを挿入するためのブロック |
| Callout Block | お知らせを記載するためのブロック |
| Brands Block | ブランドのロゴを一括表示するためのブロック |
| Features Block | 等間隔に特徴的なセクションを作るためのブロック |
| Horizontal Feature Block | 特徴的なセクションを作るためのブロック（横長） |
| Vertical Feature Block | 特徴的なセクションを作るためのブロック（縦長） |
| Intro | 見出しとサブタイトルを挿入するためのブロック |
ブロック拡張系プラグインをインストールしてGutenbergを便利に使いこなそう！
これで「Gutenbergにおすすめなプラグイン」の内容は終わりです。
この記事で紹介したプラグインの中から自分のサイトに合ったプラグインを見つけ、WordPressにインストールしてみてください。
当ブログでは、2021年にもっとも総合力の高いWordPressテーマを7つ厳選して紹介しています。
紹介しているテーマはSEOにも強いテーマばかりですので、検索からのアクセスアップも期待できますよ。
心機一転、新しいテーマを使いたい場合には、上記の記事を参考にしてみてください。
最後まで読んでいただきありがとうございました。
