メチャじじいろいろな商品を比較したいのじゃ・・、一目で違いがわかるような『表』は、ワシにも作れるかな?
チョイじじスペックや価格をきれいに並べたいんだ。でも、表作りって細かくて難しそうだし、スマホで見ると崩れちゃわないか心配で……。
お城(ブログ)の物語の中で、複数の道具(商品)やサービスを紹介するとき。その魅力をどれだけ言葉で尽くしても、読者さんが最後に求めるのは「結局、自分に合うのはどれ?」というシンプルな答えです。
そんな時、主(あるじ)であるあなたが差し出してあげたいのが、情報の整理棚である「テーブル(表)」です。

コース | ![]() 時間 | ![]() 料金 |
|---|---|---|
| クイックボディコース | 30 min | ¥9,800 |
| スペシャルボディコース | 45 min | ¥12,600 |
| プレミアムボディーコース | 60 min | ¥15,800 |
| 全身アロマコース | 90min | ¥19,000 |
| パーフェクトボディコース | 120 min | ¥24,000 |
表を作るのは、不器用な僕たちにとっては「線を引き、枠を整え……」と、なんだか大掛かりな工事のように感じてしまいますよね。でも、SWELLという魔法のお城なら大丈夫。あらかじめ用意された「テンプレート」を選び、中身を埋めていくだけで、プロが作ったような美しい比較表が完成しますよ!
この記事では、読者さんの「迷い」を「納得」に変えるための、テーブルブロックの使い方と、スマホでも美しく見せるための工夫を、優しく丁寧にお伝えします。
- 選ぶだけの魔法: SWELLが用意してくれた、便利なテーブルテンプレート。
- 納得の比較術: 読者さんが一番知りたい情報を、きれいに整列させる手順。
- おもてなしの装飾: 「○×」や「ボタン」を使って、より直感的に伝えるコツ。
- スマホへの気配り: 小さな画面でも表が崩れない、SWELLならではの細やかな設定。
👉 ひとつだけでも受け取ってもらえれば、うれしく思います!
テーブル(表)を作るのは、「お城の展示室に、見やすく整理された『比較パネル』を設置する」ような作業です。
全部を文章で説明しようとして、かえって読者さんを疲れさせてしまうことがあります。でも、大切な情報をキュッとまとめた表が一つあるだけで、読者さんの「選ぶ疲れ」は驚くほど軽くなるんです。
主(あるじ)であるあなたが、読者さんのために情報を整理し、見やすく整える。その「整理整頓の心」こそが、お城の信頼性を高め、読者さんをゴールへと優しく導いてくれるんですよ。
🌱 まだ、自分のお城をもっていない方へ!
もし、この記事を読んでいるあなたが、「まだ自分のお城(ブログ)を持っていないけれど、書く準備だけはしておきたい!」という段階なら、まずはそのワクワクした気持ちを形にしてみませんか?
🚀 【最短ルート】今すぐ始めたい方は、コチラ!
【 重要 】
手順を調べる時間は最小限に…、WordPressを最短10分でブログを開通させたい方は、こちらの「最短・画像付きマニュアル」から読み進めてみてくださいね!
シニアでも失敗なく、誰でもできるやり方を解説していますよ! それは、新しい世界を知るための切符です…。
さあ、僕と一緒に、あなたの「自分のお城」の基礎工事を始めましょう!
選ぶだけでプロの仕上がり!SWELLのテーブルテンプレート
表作りと聞くと、「線を一本ずつ引いて、色を塗って……」という細かい作業を想像して、少し気が重くなってしまいますよね。でもSWELLなら、あらかじめプロがデザインした「テンプレート」が用意されていますよ!
まずは、お城の編集画面で「テーブルブロック」を呼び出してみてください。あなたは、その中から自分のお城のデザインに合うものを選び、中身を埋めていくだけ。それだけで、雑誌のような美しい表が完成します…。

テンプレートの種類

- 「ブロック」から「パターン」を選択

- 『パターン』『SWELLテーブル』

- 5種類用意されています。

💡ひろおじの “寄り添い” アドバイス
最初から「完璧におしゃれな表を作らなきゃ!」と意気込んでしまい、結局形にならないことがよくあります。
でも、SWELLが用意してくれたテンプレートは、いわば「魔法の型紙」です。まずはこの型紙をそのまま使ってみましょう。それだけで、読者さんにとっては驚くほど見やすく、整った印象になるんです。

読者の迷いを晴らす!SWELLで「比較表」を作る手順
お城を訪れた読者さんが「結局どれがいいの?」と迷っているとき、一番の助けになるのが「比較表」です。商品のスペックや価格を横並びにすることで、言葉で説明するよりもずっと直感的に違いを伝えることができます。
作り方はとてもシンプルです。テーブルブロックを設置したら、行と列の数を決め、あとはそれぞれの枠に情報を入れていくだけ。SWELLなら、表の「一番上の行(ヘッダー)」に色をつけたり、一番左の列を強調したりするのもボタン一つ。不器用な指先でも、パズルを完成させるようにスムーズに比較表が組み上がりますよ。
今回は、この表を作ってみましょう!

先程のテンプレートを修正しながらでも「比較表」はできるのですが、
今日は、「一から表を作る方法」で作成していきましょう!


カラム数(列=縦) 行数(行=横)です。後からいくらでも増減できるので、適当な記入でいいです。

この上部の表を下のようにしていくわけですが、
| りんご (長野県産) | オレンジ (ネーブル) | バナナ (タイ産) | |
| カロリー | 57㎉ | 46㎉ | 86㎉ |
| タンパク質 | 0.1g | 0.9g | 1.1g |
| カリウム | 120㎎ | 180㎎ | 360㎎ |
| リン | 12㎎ | 22㎎ | 27㎎ |
| 食塩相当量 | 0g | 0g | 0g |
| 只今の在庫 | ある | 入荷待ち | ない |
上の表をこんな下のような感じにしていきます。
| りんご (長野産) | オレンジ (ネーブル) | バナナ (タイ産) | |
|---|---|---|---|
| カロリー | 57㎉ | 46㎉ | 86㎉ |
| タンパク質 | 0.1g | 0.9g | 1.1g |
| カリウム | 120㎎ | 180㎎ | 360㎎ |
| リン | 12㎎ | 22㎎ | 27㎎ |
| 食塩相当量 | 0g | 0g | 0g |
| 只今の在庫 | ある | 入荷待ち | ない |
バーの『表を編集』で、行を挿入したり、削除することができます。

「セルの背景」にて、「カラー」はセル自体に色を付ける事ができます。「アイコン」は、7行目の在庫の有無の欄で、背景に、〇、△、☓が表示されてましたが、その設定です。

「テーブル内書式」では、文字の折り返し禁止等の設定ができます。

「SWELL装飾」で主に使うのは、『インラインボタン』です。

「さらに表示」では、インライン画像をよく使います。

右上の「設定」から「表のセル幅を固定」「ヘッダーセレクション」をONにして、セル幅を均等に、一行目をヘッダーとして管理できるようにします。

「ヘッダーカラー」からヘッダーの色をオレンジにしてみます。

「テーブル全体の中央揃え設定」から「垂直・水平」にします。
これで、何となく表らしくなりました。

この上の一番左の列(見出し部分)は、ちょっと目立たせたいですよね。現在この黒い文字は、<td>
ですが、左列を<td>から<th>(見出し)に変更します。
「tbodyの一列目を TH に変換する」という便利なボタンがあるのでクリックします。
一番左の列が thとなり、背景がデフォルトで設定されている色になり、文字も太字になりました。

「BODY内のTH協調カラー」で色を薄ピンクにすると、左側一列がピンクになりました。

ここからは、セル一つ一つを設定していくことになります。
「セル背景」から『ある』のセルのカラーを薄緑色、アイコンを◎で設定、同様に「入荷待ち」に『ない』も設定してみます。

現在、表はこんな感じになっていると思います。
| りんご (長野産) | オレンジ (ネーブル) | バナナ (タイ産) | |
|---|---|---|---|
| カロリー | 57㎉ | 46㎉ | 86㎉ |
| タンパク質 | 0.1g | 0.9g | 1.1g |
| カリウム | 120㎎ | 180㎎ | 360㎎ |
| リン | 12㎎ | 22㎎ | 27㎎ |
| 食塩相当量 | 0g | 0g | 0g |
| 只今の在庫 | ある | 入荷待ち | ない |
ボタンにしたい文字を選び、『SWELL装飾』から『インラインボタン』でボタンにします。
必要に応じてリンクを設定します。

🚩 ひろおじ編集室の「ここだけの話」
「表」ってちょっと難しいイメージがありますよね!
「なんとなく面倒だからちょっとやめとこか?」なんてついつい思いがちですが、記事中に「表」が一個あるだけでも、説明がわかりやすかったり、雰囲気が変わったりします。
通常であれば、有料プラグインを導入しなければできないような「表」が、デフォルトであっという間にできてしまうのですから、『SWELLは割安』と言われるのが納得できますよね。

さらに見やすく!比較表を「おもてなし仕様」に整えるコツ
基本の表ができたら、次は読者さんが「一目で納得」できるような工夫を凝らしてみましょう。SWELLのテーブルブロックには、表をさらにおしゃれで便利にするための隠し味がたくさん詰まっています。
せっかくなので、さっきの表をもっとそれらしく見えるようにしてみました。
ちょっと、手を加えると急にそれっぽくなりますね。
| 種類 | ![]() りんご (長野産) | ![]() オレンジ (ネーブル) | ![]() バナナ (タイ産) |
|---|---|---|---|
| カロリー | 57㎉ | 46㎉ | 86㎉ |
| タンパク質 | 0.1g | 測定中 | 1.1g |
| カリウム | 120㎎ | 360㎎ | |
| リン | 12㎎ | 22㎎ | 夏:27㎎ 冬:25㎎ |
| 食塩相当量 | 0g | 0g | 0g |
| 只今の在庫 | ある | 入荷待ち | ない |
| 評価 | |||
| さらに詳しく | 詳しく見る | 詳しく見る | 詳しく見る |
- 『インライン画像』からりんご、オレンジ、バナナの絵を挿入
- セルを結合(測定中の部分)
- 『テーブル内書式』でドットのマーク
- 『ショートコード』から評価用スターを設置
- 下部色の装飾
ちょっと工夫すると立派に見えますので、ぜひチャレンジしてみてくださいね。
🕯️ ひろおじの「夜更けの独り言」
「おしゃれにする」と聞くと、なんだかセンスが問われているようでドキドキしてしまいますよね。
でも、ここでの「おしゃれ」とは、着飾ることではなく、「読者さんが一瞬で理解できる工夫」のこと。アイコンを使ったり、色で強弱をつけたりするのは、すべて迷子の読者さんへの「道しるべ」なんです。
読者さんの視線に寄り添って、表の中に小さな「気配り」を散りばめる。その工夫こそが、お城の信頼感を何よりも高く積み上げてくれるはずですよ。

「整理された表」は、読者さんへの最高のギフト
ひろおじお疲れ様でした!あなたのお城に、情報の整理棚である「テーブル(表)」は無事に設置できましたでしょうか。
「表を作るなんて、自分には難しそう」と感じていた不器用な僕たちも、SWELLのテンプレートや直感的な操作を味方につければ、まるでパズルを解くように楽しく、美しい比較表を作ることができたはずです。
- テンプレートの魔法: 選ぶだけで、プロ仕様のデザインが手に入る。
- 比較表の力: 迷っている読者さんの視線を整え、一瞬で納得へと導く。
- おもてなしの装飾: ○×やボタン、色使いで「分かりやすさ」を追求する。
- スマホへの優しさ: 横スクロールの設定で、どんな画面でも美しく。
文章だけでは伝えきれない情報の「重なり」を、スッキリと整えてあげること。それは、お城を訪れた読者さんの大切な時間を奪わず、スムーズに答えを見つけてもらうための、主(あるじ)としての究極の優しさなんですよ。

🍵 ひろおじの「お茶の間、最後の一息」
最後まで読んでくださり、本当にありがとうございます…😄。
比較表を作る作業は、実は自分自身の頭の中を整理する時間でもあります。
50代・60代、シニア世代は、ついつい「あれもこれも良いですよ!」と熱く語りすぎてしまいます。でも、一度表にまとめてみることで、「あ、読者さんが本当に知りたいのはここだったんだ」と、大切な本質に気づくことができるんです。
あなたが、読者さんのためにコツコツと枠を埋め、色を整えて作ったその表は、お城の信頼性を高める立派な資産になります。さあ、整った景色を眺めながら、また新しい物語を綴っていきましょう!
🏁 まだお城を建てる前の方が人生の第2幕をスタートするには?
さて、「SWELLのテーブルブロック活用術」が理解できたところで、あなたには、それを形にする『お城(ブログ)の準備』はできていますか?
ひろおじ不器用な僕でも、手順通りに進めたら自分だけのお城が建ちましたよ! 失敗のない「人生の第2幕」、ここから一緒にスタートしてみませんか?
📌 マニュアルは、コチラ!
🚀 【最短ルート】世界中の「見知らぬ友」と繋がる扉を開こう!
【 重要 】
あなたの人生経験を待っている人が、この広い空の下に必ずいます。一人じゃない安心感を持って、新しい交流の場へ飛び込んでみませんか?

SWELLのテーブルブロック活用術|読者に喜ばれる「比較表」の作り方でよくある Q&A
「ブログを整えたいけど、どこから手をつければいいのか迷ってしまう…。」
WordPressで運営していると、ふと自分のブログを見返して「もう少し理想に近づけたい」と感じる瞬間がありますよね。
本当に魅力的なデザインは、見た目の派手さではなく、運営者が気に入り、読者が自然と心地よく感じられること。
今はセンスだけに頼る時代ではなく、便利なツールや工夫で誰でも整えられる時代です。
この記事では、迷わずデザインを整えるコツと、すぐ取り入れられる実践的なアイデアをわかりやすく紹介していきます。
また「SWELLのテーブルブロック活用術|読者に喜ばれる「比較表」の作り方」が読み終わりましたら、次は、「ブログの画像ファイル形式はどれが正解?JPEG・PNG・WebPの違いと使い分け!」を確認してみましょう。
詳しい内容は下記の記事で紹介しているので、あわせて読んでみてくださいね!











