MENU
★★★ キャンペーン期間中、新規に『エックスサーバー』を申し込みすると、12ヶ月以上の契約で、初回のご利用料金が最大30%オフ!! 2026年7月6日(月)17:00まで! ・・・★★★☆彡

SWELLのテーブルブロック活用術|読者に喜ばれる「比較表」の作り方

当ページのリンクには広告が含まれています。
メチャじじ

いろいろな商品を比較したいのじゃ・・、一目で違いがわかるような『表』は、ワシにも作れるかな?

チョイじじ

スペックや価格をきれいに並べたいんだ。でも、表作りって細かくて難しそうだし、スマホで見ると崩れちゃわないか心配で……。

お城(ブログ)の物語の中で、複数の道具(商品)やサービスを紹介するとき。その魅力をどれだけ言葉で尽くしても、読者さんが最後に求めるのは「結局、自分に合うのはどれ?」というシンプルな答えです。

そんな時、主(あるじ)であるあなたが差し出してあげたいのが、情報の整理棚である「テーブル(表)」です。

表の参考図1
スクロールできます


コース

時間

料金
クイックボディコース30 min¥9,800
スペシャルボディコース45 min¥12,600
プレミアムボディーコース60 min¥15,800
全身アロマコース90min¥19,000
パーフェクトボディコース120 min¥24,000

表を作るのは、不器用な僕たちにとっては「線を引き、枠を整え……」と、なんだか大掛かりな工事のように感じてしまいますよね。でも、SWELLという魔法のお城なら大丈夫。あらかじめ用意された「テンプレート」を選び、中身を埋めていくだけで、プロが作ったような美しい比較表が完成しますよ!

この記事では、読者さんの「迷い」を「納得」に変えるための、テーブルブロックの使い方と、スマホでも美しく見せるための工夫を、優しく丁寧にお伝えします。

🚩 この記事で一緒に解決すること…
  • 選ぶだけの魔法: SWELLが用意してくれた、便利なテーブルテンプレート。
  • 納得の比較術: 読者さんが一番知りたい情報を、きれいに整列させる手順。
  • おもてなしの装飾: 「○×」や「ボタン」を使って、より直感的に伝えるコツ。
  • スマホへの気配り: 小さな画面でも表が崩れない、SWELLならではの細やかな設定。

👉 ひとつだけでも受け取ってもらえれば、うれしく思います!

テーブル(表)を作るのは、「お城の展示室に、見やすく整理された『比較パネル』を設置する」ような作業です。

全部を文章で説明しようとして、かえって読者さんを疲れさせてしまうことがあります。でも、大切な情報をキュッとまとめた表が一つあるだけで、読者さんの「選ぶ疲れ」は驚くほど軽くなるんです。

主(あるじ)であるあなたが、読者さんのために情報を整理し、見やすく整える。その「整理整頓の心」こそが、お城の信頼性を高め、読者さんをゴールへと優しく導いてくれるんですよ。

🌱 まだ、自分のお城をもっていない方へ!

もし、この記事を読んでいるあなたが、「まだ自分のお城(ブログ)を持っていないけれど、書く準備だけはしておきたい!」という段階なら、まずはそのワクワクした気持ちを形にしてみませんか?

🚀 【最短ルート】今すぐ始めたい方は、コチラ!

【 重要 】

手順を調べる時間は最小限に…、WordPressを最短10分でブログを開通させたい方は、こちらの「最短・画像付きマニュアル」から読み進めてみてくださいね!

👉〔【2026】WordPressを始める手順|シニアが最短でゼロから公開までの全ステップ 〕

シニアでも失敗なく、誰でもできるやり方を解説していますよ! それは、新しい世界を知るための切符です…。

さあ、僕と一緒に、あなたの「自分のお城」の基礎工事を始めましょう!

目次

選ぶだけでプロの仕上がり!SWELLのテーブルテンプレート

表作りと聞くと、「線を一本ずつ引いて、色を塗って……」という細かい作業を想像して、少し気が重くなってしまいますよね。でもSWELLなら、あらかじめプロがデザインした「テンプレート」が用意されていますよ!

まずは、お城の編集画面で「テーブルブロック」を呼び出してみてください。あなたは、その中から自分のお城のデザインに合うものを選び、中身を埋めていくだけ。それだけで、雑誌のような美しい表が完成します…。

SWELLのテーブルには、「テンプレートもあるのか~」って感心しているところ…。

テンプレートの種類

STEP
ブロック挿入ツール切り替えボタンをクリック
テーブルブロック切り替え
STEP
パターンを選びます。
  • 「ブロック」から「パターン」を選択
パターン
STEP
SWELLテーブルを選択
  • 『パターン』『SWELLテーブル』
swellテーブル
STEP
表のテンプレート
  • 5種類用意されています。
swellのテーブルブロック、テンプレート

💡ひろおじの “寄り添い” アドバイス

最初から「完璧におしゃれな表を作らなきゃ!」と意気込んでしまい、結局形にならないことがよくあります。

でも、SWELLが用意してくれたテンプレートは、いわば「魔法の型紙」です。まずはこの型紙をそのまま使ってみましょう。それだけで、読者さんにとっては驚くほど見やすく、整った印象になるんです。

読者の迷いを晴らす!SWELLで「比較表」を作る手順

お城を訪れた読者さんが「結局どれがいいの?」と迷っているとき、一番の助けになるのが「比較表」です。商品のスペックや価格を横並びにすることで、言葉で説明するよりもずっと直感的に違いを伝えることができます。

作り方はとてもシンプルです。テーブルブロックを設置したら、行と列の数を決め、あとはそれぞれの枠に情報を入れていくだけ。SWELLなら、表の「一番上の行(ヘッダー)」に色をつけたり、一番左の列を強調したりするのもボタン一つ。不器用な指先でも、パズルを完成させるようにスムーズに比較表が組み上がりますよ。

今回は、この表を作ってみましょう!

比較表参考図

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

STEP
ブロック挿入ツール切り替えボタンをクリック
テーブルブロック切り替え
STEP
テーブルを選択します
テーブル選択
STEP
カラム数、行数を入れます

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

テーブル カラム 行数
STEP
とりあえず大体の項目を入れてみます。

この上部の表を下のようにしていくわけですが、

りんご
(長野県産)
オレンジ
(ネーブル)
バナナ
(タイ産)
カロリー57㎉46㎉86㎉
タンパク質0.1g0.9g1.1g
カリウム120㎎180㎎360㎎
リン12㎎22㎎27㎎
食塩相当量0g0g0g
只今の在庫ある入荷待ちない

上の表をこんな下のような感じにしていきます。

スクロールできます
りんご
(長野産)
オレンジ
(ネーブル)
バナナ
(タイ産)
カロリー57㎉46㎉86㎉
タンパク質0.1g0.9g1.1g
カリウム120㎎180㎎360㎎
リン12㎎22㎎27㎎
食塩相当量0g0g0g
只今の在庫ある入荷待ちない
100gあたりの成分値
STEP
セルを設定するには?

バーの『表を編集』で、行を挿入したり、削除することができます。

セル 表を編集

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

セルの背景

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

テーブル内書式

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

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

インライン画像
STEP
表を整えます。

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

セルの幅固定

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

ヘッダーもカラー

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

セルの文字中央揃え

この上の一番左の列(見出し部分)は、ちょっと目立たせたいですよね。現在この黒い文字は、<td>
ですが、左列を<td>から<th>(見出し)に変更します。

「tbodyの一列目を TH に変換する」という便利なボタンがあるのでクリックします。
一番左の列が thとなり、背景がデフォルトで設定されている色になり、文字も太字になりました。

列を変換

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

列の色

ここからは、セル一つ一つを設定していくことになります。

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

セルの背景

現在、表はこんな感じになっていると思います。

スクロールできます
りんご
(長野産)
オレンジ
(ネーブル)
バナナ
(タイ産)
カロリー57㎉46㎉86㎉
タンパク質0.1g0.9g1.1g
カリウム120㎎180㎎360㎎
リン12㎎22㎎27㎎
食塩相当量0g0g0g
只今の在庫ある入荷待ちない
100gあたりの成分値

ボタンにしたい文字を選び、『SWELL装飾』から『インラインボタン』でボタンにします。
必要に応じてリンクを設定します。

インラインボタン
STEP
完成しました。

できました。なかなかいい感じです。

スクロールできます
りんご
(長野産)
オレンジ
(ネーブル)
バナナ
(タイ産)
カロリー57㎉46㎉86㎉
タンパク質0.1g0.9g1.1g
カリウム120㎎180㎎360㎎
リン12㎎22㎎27㎎
食塩相当量0g0g0g
只今の在庫ある入荷待ちない
詳しく見る詳しく見る詳しく見る
表の練習

🚩 ひろおじ編集室の「ここだけの話」

「表」ってちょっと難しいイメージがありますよね!

「なんとなく面倒だからちょっとやめとこか?」なんてついつい思いがちですが、記事中に「表」が一個あるだけでも、説明がわかりやすかったり、雰囲気が変わったりします。

通常であれば、有料プラグインを導入しなければできないような「表」が、デフォルトであっという間にできてしまうのですから、『SWELLは割安』と言われるのが納得できますよね。

さらに見やすく!比較表を「おもてなし仕様」に整えるコツ

基本の表ができたら、次は読者さんが「一目で納得」できるような工夫を凝らしてみましょう。SWELLのテーブルブロックには、表をさらにおしゃれで便利にするための隠し味がたくさん詰まっています。

せっかくなので、さっきの表をもっとそれらしく見えるようにしてみました。
ちょっと、手を加えると急にそれっぽくなりますね。

スクロールできます
種類
りんご
(長野産)

オレンジ
(ネーブル)

バナナ
(タイ産)
カロリー57㎉46㎉86㎉
タンパク質0.1g測定中1.1g
カリウム120㎎360㎎
リン12㎎22㎎夏:27㎎
冬:25㎎
食塩相当量0g0g0g
只今の在庫ある入荷待ちない
評価
さらに詳しく詳しく見る詳しく見る詳しく見る
テーブルブロックの練習(内容は合っていません)

  • 『インライン画像』からりんご、オレンジ、バナナの絵を挿入
  • セルを結合(測定中の部分)
  • 『テーブル内書式』でドットのマーク
  • 『ショートコード』から評価用スターを設置
  • 下部色の装飾

ちょっと工夫すると立派に見えますので、ぜひチャレンジしてみてくださいね。

🕯️ ひろおじの「夜更けの独り言」

「おしゃれにする」と聞くと、なんだかセンスが問われているようでドキドキしてしまいますよね。

でも、ここでの「おしゃれ」とは、着飾ることではなく、「読者さんが一瞬で理解できる工夫」のこと。アイコンを使ったり、色で強弱をつけたりするのは、すべて迷子の読者さんへの「道しるべ」なんです。

読者さんの視線に寄り添って、表の中に小さな「気配り」を散りばめる。その工夫こそが、お城の信頼感を何よりも高く積み上げてくれるはずですよ。

「整理された表」は、読者さんへの最高のギフト

ひろおじ

お疲れ様でした!あなたのお城に、情報の整理棚である「テーブル(表)」は無事に設置できましたでしょうか。

「表を作るなんて、自分には難しそう」と感じていた不器用な僕たちも、SWELLのテンプレートや直感的な操作を味方につければ、まるでパズルを解くように楽しく、美しい比較表を作ることができたはずです。

  • テンプレートの魔法: 選ぶだけで、プロ仕様のデザインが手に入る。
  • 比較表の力: 迷っている読者さんの視線を整え、一瞬で納得へと導く。
  • おもてなしの装飾: ○×やボタン、色使いで「分かりやすさ」を追求する。
  • スマホへの優しさ: 横スクロールの設定で、どんな画面でも美しく。

文章だけでは伝えきれない情報の「重なり」を、スッキリと整えてあげること。それは、お城を訪れた読者さんの大切な時間を奪わず、スムーズに答えを見つけてもらうための、主(あるじ)としての究極の優しさなんですよ。

デフォルトでこんなきれいな表が作れるなんて、「やっぱりSWELLは、人気があるわけだ」って知ったところ…。

🍵 ひろおじの「お茶の間、最後の一息」

最後まで読んでくださり、本当にありがとうございます…😄。

比較表を作る作業は、実は自分自身の頭の中を整理する時間でもあります。

50代・60代、シニア世代は、ついつい「あれもこれも良いですよ!」と熱く語りすぎてしまいます。でも、一度表にまとめてみることで、「あ、読者さんが本当に知りたいのはここだったんだ」と、大切な本質に気づくことができるんです。

あなたが、読者さんのためにコツコツと枠を埋め、色を整えて作ったその表は、お城の信頼性を高める立派な資産になります。さあ、整った景色を眺めながら、また新しい物語を綴っていきましょう!

🏁 まだお城を建てる前の方が人生の第2幕をスタートするには?

さて、「SWELLのテーブルブロック活用術」が理解できたところで、あなたには、それを形にする『お城(ブログ)の準備』はできていますか?

ひろおじ

不器用な僕でも、手順通りに進めたら自分だけのお城が建ちましたよ! 失敗のない「人生の第2幕」、ここから一緒にスタートしてみませんか?

📌 マニュアルは、コチラ!

🚀 【最短ルート】世界中の「見知らぬ友」と繋がる扉を開こう!

【 重要 】

👉〔【2026】WordPressを始める手順|シニアが最短でゼロから公開までの全ステップ 〕

あなたの人生経験を待っている人が、この広い空の下に必ずいます。一人じゃない安心感を持って、新しい交流の場へ飛び込んでみませんか?

SWELLのテーブルブロック活用術|読者に喜ばれる「比較表」の作り方でよくある Q&A

表の行や列を、後から増やすことはできる?

はい!編集画面のツールバーから、ボタン一つで簡単に追加・削除ができます。

スマホで見ると表が画面からはみ出ちゃう……。

SWELLの設定パネルにある「横スクロールを許可する」にチェックを入れましょう。これでスマホでも快適にスワイプして見てもらえます。

セルの中にリンク(ボタン)を貼ることはできる?

もちろん可能です。表の中に「公式サイトはこちら」といったボタンを置くのが、成約率を上げる秘訣ですよ。

表全体の背景色を変えたいんだけど。

設定パネルの「色設定」から自由に変更できます。お城の雰囲気に合わせて調整してみてくださいね。

特定のセルだけ色を目立たせることはできる?

はい、特定のセルを選んで背景色を指定できます。「一番のおすすめ」を強調するのにぴったりです。

表の中に画像を埋め込むことはできる?

できます!商品の写真を並べると、より直感的で分かりやすい比較表になりますよ。

エクセルやスプレッドシートからコピーして貼り付けられる?

基本的には可能です。貼り付けた後に、SWELLのテンプレートを適用すれば一瞬できれいになります。

表の線(ボーダー)を消して、スッキリさせたい。

テンプレートの中から「線なし」や「シンプル」を選ぶことで、ミニマルな表現も可能です。

文字を中央揃えにしたいんだけど。

ツールバーにある「配置」ボタンから、セルごとに、あるいは列ごとに一括で調整できます。

大きな表を作ると記事が重くなる?

WELLは軽量に設計されているので、多少大きな表を作っても大丈夫です。ただし、読者さんが見やすい「適度なサイズ」を心がけてくださいね。

🗺️ シニアが愛着が持てるデザインの秘訣!

「ブログを整えたいけど、どこから手をつければいいのか迷ってしまう…。」

WordPressで運営していると、ふと自分のブログを見返して「もう少し理想に近づけたい」と感じる瞬間がありますよね。

本当に魅力的なデザインは、見た目の派手さではなく、運営者が気に入り、読者が自然と心地よく感じられること。

今はセンスだけに頼る時代ではなく、便利なツールや工夫で誰でも整えられる時代です。

この記事では、迷わずデザインを整えるコツと、すぐ取り入れられる実践的なアイデアをわかりやすく紹介していきます。

また「SWELLのテーブルブロック活用術|読者に喜ばれる「比較表」の作り方」が読み終わりましたら、次は、「ブログの画像ファイル形式はどれが正解?JPEG・PNG・WebPの違いと使い分け!」を確認してみましょう。

詳しい内容は下記の記事で紹介しているので、あわせて読んでみてくださいね!

よかったらシェアしてね!
目次