比較表では、複数の項目を水平または垂直に比較し、それぞれの主な特徴を強調することができます、 仕様書, and other features. It’s a powerful way to let users make informed decisions.
比較表は デフォルトのWordPressテーブルブロックしかし、多くの制限があります。デフォルトのブロックには、画像、ボタン、リストを追加できません。
テーブルバーグ is a wonderful table builder plugin that overcomes all these limitations. In this article, we’ll show you two methods of how to create a comparison table in WordPress – with a plugin and no plugin.
美しいテーブルを作る
ブロックエディター付き
方法1:プラグインを使用しない
You’ll get a default Table block in the WordPress block library. You can create a basic-level comparison table with it.
ステップ1:投稿/ページエディタにテーブルブロックを追加する
をクリックする。 プラス(+)アイコン. Type テーブル in the search box. Once the block appears, add it to the editor of your post/page.
ステップ2:列番号と行番号の定義
Define the column and row number as you want for the table. In this tutorial, we’ll select 4*3 for the comparison table.
ステップ3:テーブルに情報を追加する
Now, add information to the table. You can only add textual information; no images, buttons, or any other block.
Here is a demo table we have made ready for the post.
方法2:Tablebergプラグインを使用する
最初のメソッドでお分かりのように、このメソッドには イメージ, buttonまたは、デフォルト・テーブル・ブロックで作成された比較テーブルへ。しかし、これらの要素がないと、比較表はユーザーをトリガーすることができません。
テーブルバーグ is a wonderful Gutenberg-friendly table builder plugin that can help you overcome all these limitations.
ステップ01: Tablebergプラグインをインストールする
Log into your WordPress dashboard. Go to プラグイン > 新規プラグインの追加. Type テーブルバーグ in the search box to find the plugin. Once the plugin appears below, hit the Install Now ボタンをクリックする。 アクティベート it afterward.
ステップ02:Tablegergブロックの追加
Open a post or page. Add the 卓球ブロック をWordPressのエディタから開きます。
ステップ03:行数と列数の選択
Select the number of rows and columns as you do with the default table block. Hit the テーブル作成 button after that. We’ll select two (2) columns and four (4) rows.
ステップ04:テーブルにコンテンツを追加する
Add headings to the columns. Hit the プラス (+) icon and select the block as you want. Select the イメージブロック after that. This will allow you to add an image to the cell.
# Add Images to the Table
You can see we have added an image respectively to each column.
# Add Lists to the Table
Next, select the リストブロック. Using this block, you can list all the features of your product. Do this to the respective row of each column.
# Add Buttons to the Table
Now, add the ボタンブロック to the table. This will allow you to add a CTA button for each product.
Once the blocks are added, you can customize them from the スタイル タブをクリックしてください。
Thus, you can create versatile and multipurpose comparison tables using the TableBerg plugin.
Video Tutorial
こちらもお読みください:
結論
Creating comparison tables can greatly enhance user experience by presenting information in a structured and easily digestible format. TableBerg promises to revolutionize your WordPress table building experience with more stunning releases in the coming days.
Here’s a quick guide on how to remove table borders in WordPress so you can make your table design more captivating.