SWELLのキャプションボックスの使い方｜活用例も解説

2026年10月25日

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

記事の大事なポイントを、もっと目立たせてわかりやすく伝えたいと思っていませんか。私も以前は太字だけで強調していましたが、読者に大切な部分を読み飛ばされてしまうことが多かったんです。

この記事では、SWELLの「キャプションボックス」の使い方を初心者向けにわかりやすく解説します。実際に記事で活用してきた体験も交えるので、読みながら進めれば、要点がひと目で伝わる記事を作れるようになります。

※これからSWELLを導入する方へ：SWELLは買い切り型のWordPressテーマで、追加費用の心配がありません。この記事を見ながら進めれば、初心者でも迷わずおしゃれなブログを作れます。

➡️【公式】SWELLの公式サイトはこちら

デザインに悩む時間を減らして、記事作りに集中できます。

ニャフィ

大事なところを、もっと目立たせたいのにゃ！

たいがブログ

要点が埋もれてしまうと、もったいないですよね。

ニャフィ

ボックスの種類が多くて、どれを使えばいいのかにゃ？

たいがブログ

キャプションボックスの使い方を、5つの手順で解説しますね。

SWELLのキャプションボックスとは

キャプションボックスは、タイトル付きの枠で情報をまとめられるSWELLの装飾ブロックです。「この記事のポイント」のように見出しを付けて囲めるので、要点がひと目で伝わります。

筆者は記事の冒頭に「この記事でわかること」をキャプションボックスで置くようにしてから、最後まで読んでもらえることが増えたと感じています。読者に全体像を先に見せることが、離脱を防ぐコツです。

タイトル付きで情報をまとめられる

キャプションボックスは、枠の上部にタイトルを表示できるのが特徴です。中には文章だけでなくリストや画像も入れられるので、さまざまな場面で使えます。

アイコンボックスとの違い

SWELLには「アイコンボックス」もあり、「ポイント」「注意」などのアイコン付きで短く伝えるのに向いています。複数の項目をまとめるならキャプションボックスと使い分けましょう。

キャプションボックスの使い方

キャプションボックスは、ブロックを追加してタイトルと中身を入力するだけで作れます。あらかじめ色を整えておけば、どの記事でも統一感のある見た目に仕上がります。

筆者はAFFINGER6でも似たボックスを使っていましたが、タグを覚えて入力する手間がありました。SWELLはブロックを選ぶだけで完成形が見えるので、装飾にかける時間がぐっと減りました。

タイトルは短く具体的にする

キャプションのタイトルは、「この記事でわかること」「必要なもの」のように短く具体的にしましょう。中身を読む前に内容が予想できるタイトルが理想です。

色はエディター設定で統一する

キャプションボックスの色は、「SWELL設定」→「エディター設定」から変更できます。サイトカラーに合わせて設定しておくと、記事全体にまとまりが出ます。

STEP

キャプションボックスを追加する

記事の編集画面で「＋」ボタンを押し、「キャプションボックス」と検索して追加します。SWELLのブロックは「SWELLブロック」の中にまとまっているので見つけやすいです。

STEP

タイトルを入力する

ボックス上部のキャプション部分に、タイトルを入力します。10文字前後の短い言葉にすると、すっきりした見た目になります。

STEP

中身を入力する

ボックスの中に、伝えたい内容を入力します。筆者は文章を詰め込みすぎてボックスが長くなり読まれなかったので、箇条書きで3〜5項目にまとめるのがおすすめです。

STEP

スタイルと色を選ぶ

右側の設定パネルから、ボックスのスタイルやカラーセットを選びます。記事の中で役割ごとに色を使い分けると、内容の違いが伝わりやすくなります。

STEP

プレビューで見え方を確認する

プレビューで、パソコンとスマホの両方の表示を確認します。スマホではボックスが縦に長くなりやすいので、文章量にも気を配りましょう。

キャプションボックスの活用例とコツ

キャプションボックスは、置く場所や使い方しだいで記事の読みやすさが大きく変わる装飾です。ここでは、実際に効果を感じた活用例とコツを紹介します。

筆者は「この記事でわかること」のボックスを毎回作っていましたが、SWELLのブログパーツに登録してからは呼び出すだけになりました。よく使う形はブログパーツにしておくと、作業時間をぐっと減らせます。

記事の冒頭で「この記事でわかること」を伝える

導入文のあとに記事の要点を3〜5項目でまとめると、読者は全体像をつかんでから読み進められます。自分に必要な記事かどうかもすぐに判断できるので親切です。

必要なものや注意点をまとめる

手順を説明する前に「準備するもの」をまとめたり、「注意点」を目立たせたりするのにも向いています。読者が作業前に確認しやすくなり、つまずきを減らせます。

キャプションボックスを使うときのコツ

1記事に2〜3個までにして使いすぎない
タイトルは10文字前後で内容がわかる言葉にする
「要点は青」「注意は赤」など色に役割を持たせる
よく使う形はブログパーツに登録しておく

よくある質問

キャプションボックスの中に別のブロックを入れられますか？: 入れられます。リストや画像、SWELLボタンなども中に配置できるので、案内と行動ボタンをひとまとめにすることも可能です。
ボックスの色をまとめて変えたいときは？: 「SWELL設定」→「エディター設定」で色を変更すると、そのカラーセットを使っているボックスにまとめて反映されます。記事ごとに直す必要はありません。
段落の「ボックス装飾」とは何が違いますか？: 段落のスタイルで選べるボックス装飾は、文章を枠で囲むだけのシンプルなものです。タイトルを付けて複数の内容をまとめたいときは、キャプションボックスが向いています。
キャプションボックスはSEOに影響しますか？: ボックス内の文章も通常の本文と同じように読み取られます。読者が要点をつかみやすくなる点で、読みやすい記事づくりに役立ちます。