Pricing Table – Highlighted Middle Plan
A sleek three-column pricing table designed for SaaS, startups, and service businesses. The middle plan is highlighted as Most Popular, helping guide visitors toward the best option. Each plan includes pricing, features, and a CTA button for easy conversions.
9月 5, 2025
作成
9月 5, 2025
更新
2
使用回数
Lite |
ベーシック 一番人気 |
プロ |
|---|---|---|
$250/month |
$500/month |
$1000/month |
Perfect for startups and small businesses |
Great for growing small businesses |
Ideal for established businesses |
|
|
|
パターン・コード
<!-- wp:tableberg/table {"version":"0.6.3","rows":5,"cols":3,"cells":15,"colStyles":{"0":{"borderRadius":{"topLeft":"8px","topRight":"8px","bottomRight":"8px","bottomLeft":"8px"},"border":{"color":"#e0f2f6","width":"2px"}},"1":{"border":{"color":"#008397","width":"2px"},"borderRadius":{"topLeft":"8px","topRight":"8px","bottomRight":"8px","bottomLeft":"8px"}},"2":{"border":{"color":"#e0f2f6","width":"2px"},"borderRadius":{"topLeft":"8px","topRight":"8px","bottomRight":"8px","bottomLeft":"8px"}},".":[]},"cellPadding":{"top":"var:preset|spacing|medium","bottom":"var:preset|spacing|medium","left":"var:preset|spacing|small","right":"var:preset|spacing|small"},"cellSpacing":{"left":"16px","right":"16px"},"enableTableHeader":"converted","headerBackgroundColor":"#ffffff","evenRowBackgroundColor":"#ffffff","oddRowBackgroundColor":"#ffffff","responsive":{"last":"stack","breakpoints":{"mobile":{"enabled":true,"headerAsCol":false,"maxWidth":700,"mode":"stack","direction":"col","stackCount":1}}},"innerBorderType":"col"} -->
<table class="wp-block-tableberg-table"><!-- wp:tableberg/cell {"tagName":"th","responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-0"} -->
<th class="wp-block-tableberg-cell"><!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">Lite</p>
<!-- /wp:paragraph --></th>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"tagName":"th","col":1,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-5"} -->
<th class="wp-block-tableberg-cell"><!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">ベーシック</p>
<!-- /wp:paragraph -->
<!-- wp:tableberg/ribbon {"type":"badge","text":"Most Popular","individual":{"x":"","y":"-15px","originX":"center","originY":"top","borderRadius":{"topLeft":"4px","topRight":"4px","bottomLeft":"4px","bottomRight":"4px"},"padding":{"right":"var:preset|spacing|small","left":"var:preset|spacing|small"}},"color":"#ffffff","background":"#008397"} /--></th>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"tagName":"th","col":2,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-10"} -->
<th class="wp-block-tableberg-cell"><!-- wp:paragraph {"fontSize":"medium"} -->
<p class="has-medium-font-size">プロ</p>
<!-- /wp:paragraph --></th>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":1,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-1"} -->
<td class="wp-block-tableberg-cell"><!-- wp:paragraph {"align":"center","style":{"typography":{"fontSize":"32px"}}} -->
<p class="has-text-align-center" style="font-size:32px"><strong><mark style="background-color:rgba(0, 0, 0, 0);color:#008397" class="has-inline-color">$250</mark></strong><sub><mark style="background-color:rgba(0, 0, 0, 0);color:#636363" class="has-inline-color">/month</mark></sub></p>
<!-- /wp:paragraph --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":1,"col":1,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-6"} -->
<td class="wp-block-tableberg-cell"><!-- wp:paragraph {"align":"center","style":{"typography":{"fontSize":"32px"}}} -->
<p class="has-text-align-center" style="font-size:32px"><strong><mark style="background-color:rgba(0, 0, 0, 0);color:#008397" class="has-inline-color">$500</mark></strong><sub>/<mark style="background-color:rgba(0, 0, 0, 0);color:#636363" class="has-inline-color">month</mark></sub></p>
<!-- /wp:paragraph --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":1,"col":2,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-11"} -->
<td class="wp-block-tableberg-cell"><!-- wp:paragraph {"align":"center","style":{"typography":{"fontSize":"32px"}}} -->
<p class="has-text-align-center" style="font-size:32px"><strong><mark style="background-color:rgba(0, 0, 0, 0);color:#008397" class="has-inline-color">$1000</mark></strong><sub><mark style="background-color:rgba(0, 0, 0, 0);color:#636363" class="has-inline-color">/month</mark></sub></p>
<!-- /wp:paragraph --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":2,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-2"} -->
<td class="wp-block-tableberg-cell"><!-- wp:paragraph {"align":"center","style":{"color":{"text":"#636363"},"elements":{"link":{"color":{"text":"#636363"}}}}} -->
<p class="has-text-align-center has-text-color has-link-color" style="color:#636363">Perfect for startups and small businesses</p>
<!-- /wp:paragraph --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":2,"col":1,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-7"} -->
<td class="wp-block-tableberg-cell"><!-- wp:paragraph {"align":"center","style":{"color":{"text":"#636363"},"elements":{"link":{"color":{"text":"#636363"}}}}} -->
<p class="has-text-align-center has-text-color has-link-color" style="color:#636363">Great for growing small businesses</p>
<!-- /wp:paragraph --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":2,"col":2,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-12"} -->
<td class="wp-block-tableberg-cell"><!-- wp:paragraph {"align":"center","style":{"color":{"text":"#636363"},"elements":{"link":{"color":{"text":"#636363"}}}}} -->
<p class="has-text-align-center has-text-color has-link-color" style="color:#636363">Ideal for established businesses</p>
<!-- /wp:paragraph --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":3,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-3"} -->
<td class="wp-block-tableberg-cell"><!-- wp:tableberg/styled-list {"itemSpacing":"var:preset|spacing|5","iconColor":"#008397","iconSize":"16px","textColor":"#3d386b"} -->
<ul class="wp-block-tableberg-styled-list"><!-- wp:tableberg/styled-list-item {"text":"1,750 sales orders/month"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"5 user limit"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"25 purchase orders/month"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"500 SKU management"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"Whatsapp/Email support"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item --></ul>
<!-- /wp:tableberg/styled-list --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":3,"col":1,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-8"} -->
<td class="wp-block-tableberg-cell"><!-- wp:tableberg/styled-list {"itemSpacing":"var:preset|spacing|5","iconColor":"#008397","iconSize":"16px","textColor":"#3d386b","listIndent":"0"} -->
<ul class="wp-block-tableberg-styled-list"><!-- wp:tableberg/styled-list-item {"text":"3,500 sales orders/month"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"10 user limit"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"50 purchase orders/month"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"1,000 SKU management"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"Whatsapp/Email support"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item --></ul>
<!-- /wp:tableberg/styled-list --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":3,"col":2,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-13"} -->
<td class="wp-block-tableberg-cell"><!-- wp:tableberg/styled-list {"itemSpacing":"var:preset|spacing|5","iconColor":"#008397","iconSize":"16px","textColor":"#3d386b"} -->
<ul class="wp-block-tableberg-styled-list"><!-- wp:tableberg/styled-list-item {"text":"8,000 sales orders/month"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"20 user limit"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"100 purchase orders/month"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"2,000 SKU management"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item -->
<!-- wp:tableberg/styled-list-item {"text":"Priority support"} -->
<div></div>
<!-- /wp:tableberg/styled-list-item --></ul>
<!-- /wp:tableberg/styled-list --></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":4,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-4"} -->
<td class="wp-block-tableberg-cell"><!-- wp:tableberg/button {"text":"Get Started","width":80,"backgroundColor":"#e0f2f6","textColor":"#008397","align":"center"} /--></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":4,"col":1,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-9"} -->
<td class="wp-block-tableberg-cell"><!-- wp:tableberg/button {"text":"Get Started","width":80,"backgroundColor":"#008397","textColor":"#ffffff","align":"center"} /--></td>
<!-- /wp:tableberg/cell -->
<!-- wp:tableberg/cell {"row":4,"col":2,"responsiveTarget":"#tableberg-b1a1a3a7-2297-4938-95ec-fbbb94c29a44-14"} -->
<td class="wp-block-tableberg-cell"><!-- wp:tableberg/button {"text":"Get Started","width":80,"backgroundColor":"#e0f2f6","textColor":"#008397","align":"center"} /--></td>
<!-- /wp:tableberg/cell --></table>
<!-- /wp:tableberg/table -->使用方法
Copy and paste this pattern into your WordPress block editor. Update the pricing, features, and call-to-action buttons to fit your own business model. You can also change which plan is highlighted by adjusting the label.
