WordPressのテーブルでおすすめ商品を強調する方法

複数の製品やプランの比較表を作成する場合、訪問者を大声を出さずに最良の選択へと導きたいものです。

シンプルなリボンやバッジをつけると効果的です。視覚的な重みを加えるだけで、注目を集めたい場所に誘導することができる。

テーブルバーグ を使えば、WordPressエディタ内でブロックを使ってテーブルを作ることができる。無料版でも基本的な機能は使えますが、トップピックを強調するリボンを追加したい場合は、プロ版が必要です。そこでリボンブロックの登場です。まさにこの目的のために作られました。

このクイックガイドでは、余分なデザインツールやショートコードを使用せずに、商品テーブルを構築し、クリーンで目立つリボンで一押しの商品をマークする方法を説明します。

美しいテーブルを作る
ブロックエディター付き

無料体験

プロになる

ステップ1: Tableberg（無料版）のインストール

無料版の テーブルバーグ をWordPressプラグインリポジトリからダウンロードする：

に移動する。 プラグイン

プラグインの追加をクリックする

"Tableberg "で検索

Click インストールそして アクティベート

一度アクティベートすれば、どの投稿やページでも "Tableberg "ブロックを使ってテーブルを作ることができる。

⚠️ Note: このチュートリアルで後述する、商品をハイライトするためのリボンブロックは Tablebergプロ.リボンやバッジを使用して製品を紹介する場合は、次のことが必要です。 Tableberg Proへのアップグレード.の指示に従ってください。 プロ版のアクティベーション方法.

ステップ 2: 比較表を作成するか、テンプレートライブラリから選択します。

投稿やページにTablebergブロックを追加しましょう。テンプレートライブラリから選ぶか、好きなように商品列を設定することができます。テンプレートライブラリから選んでみました。

表テンプレートを挿入した後、データを追加してください。スキャンしやすいレイアウトを心がけましょう。機能を詰め込みすぎず、デザインに息吹を与えましょう。

ステップ3：トップピックにリボンをつける

ここからがハイライトだ。
お薦めしたい製品を選んでください（1つだけでも効果的です）。次に

その商品の行またはセル内をクリックする

を使用する。 Ribbon block Tablebergプロより

ラベルテキストを追加する（例 🏆 オススメ)

コントラストがきれいな色、紫やゴールドなど、ブランドと調和する色を選ぶ。

最も見やすく、魅力的に見える場所に設置しましょう。

それで終わりだ。これで、あなたのベストオプションがテーブルから自然に飛び出す。

💡 インパクトを最大化するプロのヒント!

唯一のハイライト ひとつ 透明度を維持するための製品

リボンを大胆な価格設定やユニークな機能タグと組み合わせる

リボンは対照的な色を使い、ポップに仕上げる。

モバイルでプレビューし、応答性と可読性を確認する。

📀 最終的な例表（プロ機能の実際）

リボンブロックは、視覚的に 製品2お好みの色と配置でスタイリング。

製品	Price	特徴	アクション
製品1	ペリア $49	迅速かつ安全 25000人 1ウェブサイト限定	1サイト分今すぐ試す
製品2 おすすめだ！	P L U S $99	迅速かつ安全グローバー・アクセス 10万人限定	3サイト分今すぐ試す
製品3	E X P E R T $199	迅速かつ安全グローバル・アクセス 200Kビジター	100サイト分今すぐ試す