簡単にデザイン要素に優れた料金表を作れます

テーブル(表)をResponsiveで作成するのはとても骨がおれる作業です。このプラグインで、価格表などを作成するときにデザイン要素に優れたものをいくつかあるテンプレートから選ぶことができて比較的簡単に作成できるようになります。用意されたテンプレートを使わずに自作することもできます。

Responsive Pricing Table
Responsive pricing tables
Drag-and-drop builder
Unlimited pricing tables, columns and rows
Preset Templates
Column images, videos and icons
Schedule Column
Switching Toggle
Custom Header, Features list, and Button styling
Hover Animation
Comparison price tables
Tables export/import
All the Pricing Table Examples

解説動画が用意されています

有効化するとサイドメニューに「Pricing Table by Supsystic」が追加されているので「Add New Table」から「Table Name」でテンプレートとテーブルの名前を選択します。「Get in PRO」と表記があるものは有料のテンプレート、無料で使えるものは「Select」と表示されているものになります。「Show All Tables」から表のカスタマイズができるページに移動します。
日本語化されていないのですが、動画と合わせて見ればそんなに難解ではないと思います。

• カラム数を決める項目　「Add Column」をクリックするとカラムが追加できます。（カラム削除は料金表から直接行なうことになる）
• 行数を加える項目　「Add Row」をクリックするたびに行数が増えていきます。（行数の削除は料金表から直接行なう）
• テーブル幅をpixelか％のどちらかで指定する項目
• 料金表のフォントを選ぶ項目
• テーブルの位置を指定する項目　左寄せ、右寄せ、センター寄せ、noneから選択します。
• ディスクリプションの文字色を指定する項目
• ヘッダーの文字色を指定する項目
• 背景色を指定する項目
• 一つのカラムの幅を自由に設定できる項目
• ディスクリプションカラムの表示・非表示
• フッターの行の表示・非表示
• ホバーアニメーションの表示非表示
• 行の文字色を指定する項目
• ヘッダーの行の表示非表示
• ディスクリプションの行の表示非表示
• 文字の位置を指定する項目　左寄せ、右寄せ、センター寄せから選択します。
• 表をレスポンシブに対応するかどうかを指定（チェックするとスマホで表示された場合は縦に並ぶレスポンシブ自動調整となる）

表の値段や文章を変更する場合は、表に直接打ち込んで変更します。マウスオーバーすると出るメニューから直接文字を打ち込んだりフォントサイズの変更などの細かい設定ができます。行にマウスを合わせた状態でゴミ箱アイコンをクリックすると行を削除します。カラム削除も同様の手順で可能です。最初はちょっと取っ付きにくく戸惑うかもしれませんが慣れれば直感的に作業できると思います。

該当箇所にショートコードを貼り付けて反映させる

「Show All Tables」の左上に表示されているショートコードをコピーして料金表を設置する場所に貼り付けます。

インストール方法

他のプラグイン同様、WordPress管理画面 ＞ プラグイン ＞ 新規追加 ＞「Responsive Pricing Table」で検索