SWELLのグループブロックの応用的な使い方｜便利な活用術

2026年10月27日

※本記事はアフィリエイト広告を含む記事へのリンクを含みます。

記事の構成を入れ替えるたびに、ブロックを1つずつ動かすのが面倒だと感じていませんか。私も以前は、見出しと文章と画像をそれぞれ別々に移動していたため、並べ替えだけで何分もかかっていたことがあります。

この記事では、SWELLのグループブロックの応用的な使い方を、具体的な操作手順まで初心者向けに解説します。実際の失敗談も交えるので、読みながら進めれば、記事作りの手間を減らしながら見た目も整えられます。

※まだエックスサーバーを契約していない方へ：今月は最大30%OFFの限定キャンペーンが開催されています。この記事の手順を見ながら進めれば、初心者でも最短10分で国内シェアNo.1の高速ブログを開設できますよ。

➡️【公式】エックスサーバーの限定特設ページはこちら

早めに申し込むほど、キャンペーンの割引をしっかり活かせます。

ニャフィ

ブロックを1つずつ動かすのが大変なのにゃ…

たいがブログ

記事が長くなるほど、並べ替えは手間がかかりますよね。

ニャフィ

グループって、まとめる以外にも使い道があるのかにゃ？

たいがブログ

応用的な使い方を、5つのステップで解説しますね。

▼あわせて読みたい：ブロックの多い記事も快適に表示できるサーバー選びについては、こちらの記事で詳しく紹介しています。

SWELLのグループブロックとは

グループブロックは、複数のブロックをひとまとめにできるWordPress標準のブロックです。SWELLでは、ここに枠線や背景などのスタイルを付けられるので、装飾としても活躍します。

筆者がブロックを1つずつ動かしていたのは、グループ化できることを知らなかったからでした。関連するブロックをまとめておけば、移動もコピーも一度で済みます。

複数のブロックをひとまとめにできる

見出し・文章・画像などを1つのグループにまとめると、まとめて移動・コピー・削除ができます。記事の構成を入れ替えるときの作業が、ぐっと楽になります。

SWELLならスタイルや表示の設定も追加できる

SWELLでは、グループブロックにボックス風のスタイルを付けたり、パソコンやスマホだけで表示する設定をしたりできます。まとめるだけでなく、見せ方も工夫できるのが魅力です。

グループブロックの応用的な使い方

グループブロックは、枠で囲んで目立たせる使い方と、端末ごとに表示を切り替える使い方が特に便利です。どちらも右側の設定パネルから簡単に設定できます。

筆者はAFFINGER6を使っていたころ、枠で囲むためにタグを手入力していました。SWELLのグループブロックなら見たままの状態で囲めるので、装飾のミスがなくなりました。

複数のブロックをまとめて枠で囲む

注意点や補足など、まとめて目立たせたい内容はグループにしてスタイルを付けましょう。見出しとリストを一緒に囲むと、ひとかたまりの情報として伝わります。

パソコンとスマホで表示を切り替える

SWELLのデバイスごとの表示設定を使えば、グループをパソコンだけ・スマホだけに表示できます。スマホでは短い説明、パソコンでは詳しい表といった使い分けが可能です。

STEP

まとめたいブロックを選択する

最初のブロックをクリックし、「Shift」キーを押しながら最後のブロックをクリックします。これで間にあるブロックもまとめて選択されます。

STEP

グループ化する

ツールバーの「︙」メニューから「グループ化」を選びます。選んだブロックが1つのグループにまとまり、まとめて移動できるようになります。

STEP

スタイルを選ぶ

グループを選んだ状態で、右側の設定パネルの「スタイル」から枠線などのデザインを選びます。記事の雰囲気に合ったシンプルなものから試してみましょう。

STEP

背景色と余白を調整する

設定パネルで背景色や内側の余白を調整します。背景色は淡い色にすると、中の文字が読みやすくなり、記事全体にもなじみます。

STEP

表示する端末を設定して確認する

必要に応じて表示する端末を設定します。筆者は編集画面でグループが表示されたままなのを見て失敗したと勘違いしたので、プレビューで端末ごとに確認しましょう。

グループブロックをもっと便利に使うコツ

グループブロックは、使い回しや構造の確認と組み合わせると、さらに作業が楽になります。ここでは、実際に毎日記事を書きながら効果を感じたコツを紹介します。

筆者は23.8インチの外部モニターにつないだとき、画面の左側にリストビューを開いたまま編集しています。グループの入れ子になった構造がひと目でわかるので、ブロックの移動ミスが減りました。

よく使うグループはパターンに登録する

何度も使うグループは、ツールバーの「︙」メニューから「パターンを作成」で登録できます。SWELLのブログパーツに入れておく方法もあり、どの記事でもすぐに呼び出せます。

リストビューで構造を確認する

編集画面上部の「リストビュー」を開くと、グループの中にどのブロックが入っているか一覧で確認できます。グループを丸ごと選びたいときにも便利です。

グループブロック活用のチェックポイント

関連するブロックをまとめている
スタイルや背景色を付けすぎていない
端末ごとの表示をプレビューで確認している
よく使うグループをパターンに登録している

▼あわせて読みたい：リストビューを開いたままでも広々と編集できる、筆者愛用の作業用モニターはこちらで紹介しています。

よくある質問

グループを解除したいときは？: グループを選び、ツールバーの「︙」メニューから「グループ解除」を選びます。中のブロックはそのまま残るので、内容が消える心配はありません。
グループの中にグループを入れられますか？: 入れられます。ただし入れ子が深くなるとどこに何があるかわかりにくくなります。リストビューで確認しながら、2段階程度までにしておくのがおすすめです。
リッチカラムとはどう使い分ければいいですか？: 縦にまとめて囲むならグループ、横に並べて比べるならリッチカラムが向いています。グループの中にリッチカラムを入れる組み合わせも可能です。
背景色を画面いっぱいに広げたいときは？: 画面の横幅いっぱいに背景を広げたい場合は、SWELLの「フルワイド」ブロックを使うのがおすすめです。セクションの区切りをはっきり見せられます。