jekkilekki

I’ve wanted to add SIMPLE Pricing Tables to my website for a while but many of the 
plugins I tried out were either Freemium (requiring me to purchase the full version 
in order to unlock the full functionality) or more complicated than I actually wanted.
THIS plugin is exceptionally simple.
<ol>
<li>Step 1: Type the shortcode tags <code>[jkl-pricing-table] ... [/jkl-pricing-table]</code></li>
<li>Step 2: Add an <code><ol></code> ordered list for your Pricing Table</li>
<li>Step 3: Tweak until it looks right</li>
</ol>
Requires WordPress 3.5 and PHP 5.
<h4>Special Features</h4>
<ul>
<li>Styled like <a href="http://foundation.zurb.com/docs/components/pricing_tables.html" rel="nofollow ugc">Zurb Foundation 5 Pricing Tables</a></li>
<li>Utilizes CSS3 for interesting transition effects (like scaling)</li>
</ul>
<h4>How the Plugin works</h4>
<ol>
<li>The shortcode expects an ordered list of ordered lists</li>
<li>The primary ordered list is the names of your Pricing Options (Basic, Business, etc)</li>
<li>The secondary ordered lists are the content within your Pricing Options</li>
<li>Using jQuery, the plugin finds each element within the ordered lists and adds 
specific CSS classes to them based on their order (see below)</li>
<li>The SECOND Pricing Option is always set to be “popped out” by default and when 
another table is not hovered over</li>
</ol>
<h4>Translations</h4>
<ul>
<li>English (EN) – default</li>
<li>Korean (KO) – upcoming</li>
</ul>
If you want to help translate the plugin into your language, please have a look 
at the <code>.pot</code> file which contains all definitions and may be used with a [gettext] 
editor.
If you have created your own language pack, or have an update of an existing one, 
you can send your [gettext .po or .mo file] to me so that I can bundle it in the 
plugin.
<h4>Contact Me</h4>
If you have questions about, problems with, or suggestions for improving this 
plugin, please let me know at the <a href="https://wordpress.org/support/plugin/jkl-pricing-tables" rel="ugc">WordPress.org support forums</a>
Want updates about my other WordPress plugins, themes, or tutorials? Follow me <a href="http://twitter.com/jekkilekki" rel="nofollow ugc">@jekkilekki</a>
<h4>Acknowledgements</h4>
This plugin uses:
<ul>
<li><a href="http://jquery.com/" rel="nofollow ugc">jQuery</a> licensed under MIT License or GNU General Public License (GPL) Version 2</li>
</ul>
<h4>License</h4>
This program is free software; you can redistribute it and/or modify it under the terms 
of the GNU General Public License as published by the Free Software Foundation; either 
version 2 of the License, or (at your option) any later version.
This program is distributed in the hope that it will be useful, but WITHOUT ANY 
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A 
PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with this 
program; if not, write to the Free Software Foundation, Inc., 51 Franklin St, Fifth 
Floor, Boston, MA 02110-1301 USA
<h3>How To</h3>
<h4>How To Use the Plugin</h4>
<ol>
<li>Type the shortcode tags</li>
<li>Create an ordered list <code><ol></code> within the tags</li>
<li>Type the heading for your first table in the first <code><ol></code> item and hit return</li>
<li>TAB the <code><ol></code> in to add the remainder of your content for the first table</li>
<li>Un-indent the <code><ol></code> to write the heading of your second table</li>
<li>TAB in for the remainder of the content in your second table</li>
<li>Rinse, repeat for multiple tables (supports up to 5 in a row)</li>
</ol>
<h4>Example of Usage</h4>
<pre><code>[jkl-pricing-table]
<ol>
 <li>Basic
 <ol>
 <li>$150</li>
 <li>Logo only</li>
 <li>Content 1</li>
 <li>Content 2</li>
 <li>Deliverables</li>
 <li><a href='#'>Select Now</a></li>
 </ol>
 </li>
 <li>Business
 <ol>
 <li>$250</li>
 <li>Logo + Business Cards</li>
 <li>Content 1</li>
 <li>Content 2</li>
 <li>Deliverables</li>
 <li><a href='#'>Select Now</a></li>
 </ol>
 </li>
</ol>
[/jkl-pricing-table]
</code></pre>
<h4>Special CSS Classes and How to Style the Plugin</h4>
The plugin uses jQuery to dynamically add the following CSS classes to the ordered 
list elements. Use these classes in your Custom CSS if you want to change things.
<ol>
<li><code>.pricing-table</code> = Each first level ordered list item (<code><ol><li></code>)</li>
<li><code>.price</code> = The FIRST second level list item (<code><ol><li><ol><li></code>)</li>
<li><code>.description</code> = The SECOND second level list item</li>
<li>List items after this have no special styling until the end</li>
<li><code>.deliverables</code> = The SECOND-TO-LAST second level list item</li>
<li><code>.cta-button</code> (Call To Action button) = The LAST second level list item (it should be an <code><a></code> link)</li>
<li><code>.button</code> = The <code><a></code> link in the <code>.cta-button</code> list item</li>
</ol>
When applying custom CSS to change the design of your plugin, please reference these 
classes as <code>.pricing-table .class</code>
<h4>Example of CSS Classes after jQuery assigns them</h4>
<pre><code>[jkl-pricing-table]
<ol>
 <li class="pricing-table">Basic
 <ol>
 <li class="price">$150</li>
 <li class="description">Logo only</li>
 <li>Content 1</li>
 <li>Content 2</li>
 <li class="deliverables">Deliverables</li>
 <li class="cta-button"><a class="button" href='#'>Select Now</a></li>
 </ol>
 </li>
 <li class="pricing-table">Business
 <ol>
 <li class="price">$250</li>
 <li class="description">Logo + Business Cards</li>
 <li>Content 1</li>
 <li>Content 2</li>
 <li class="deliverables">Deliverables</li>
 <li class="cta-button"><a class="button" href='#'>Select Now</a></li>
 </ol>
 </li>
</ol>
[/jkl-pricing-table]
</code></pre>

JKL Pricing Tables

This is probably the SIMPLEST Pricing Tables plugin you'll ever use. Just type an ordered list of ordered lists within the shortcode tags.

wprio

Sayed

RioVizual

Tushar Das

sifatsaddam

Nazmul Asif

<h3>RioVizual – Best WordPress Table Plugin for Gutenberg</h3>
RioVizual is the most versatile WordPress table plugin designed for creating comparison tables, pricing tables, and pros & cons boxes directly in the Gutenberg block editor.
This easy-to-use Gutenberg table plugin allows you to drag and drop elements to build customizable, responsive & SEO-friendly tables with multiple columns and rows. With advanced styling and formatting options, RioVizual helps enhance user engagement and boost conversion.
<a href="https://riovizual.com/pricing/" rel="nofollow ugc">Get Pro</a> | <a href="https://riovizual.com/blocks/table-builder/demo/" rel="nofollow ugc">View Table Builder Demo</a> | <a href="https://riovizual.com/blocks/pricing-table/demo/" rel="nofollow ugc">View Pricing Table Demo</a> | <a href="https://riovizual.com/blocks/pros-cons/demo/" rel="nofollow ugc">View Pros & Cons Demo</a> | <a href="https://riovizual.com/docs/" rel="nofollow ugc">Read Documentation</a>
<h3>🔥RioVizual Gutenberg Blocks (More Coming Soon!)</h3>
This powerful WordPress table block plugin includes three highly customizable Gutenberg blocks:
<ul>
<li>
Table Builder Block: Create fully customizable and responsive tables with drag-and-drop functionality in the Gutenberg editor. <a href="https://riovizual.com/blocks/table-builder/" rel="nofollow ugc">(Learn More)</a>
</li>
<li>
Pricing Table Block: Easily compare pricing plans for your products or services with customizable pricing tables. <a href="https://riovizual.com/blocks/pricing-table/" rel="nofollow ugc">(Learn More)</a>
</li>
<li>
Pros & Cons Block: Highlight the benefits and drawbacks of products or services with attractive pros and cons tables. <a href="https://riovizual.com/blocks/pros-cons/" rel="nofollow ugc">(Learn More)</a>
</li>
</ul>
With RioVizual, you can also access a library of pre-designed table templates, streamlining the process of creating stunning comparison tables, pricing tables, and pros & cons boxes in the block editor.
<h3>💯 Why is RioVizual The Best Table Plugin for WordPress?</h3>
See the features which are exclusive to the RioVizual plugin and understand why RioVizual is possibly the Best Table Plugin for WordPress.
✅ Easy Drag-and-Drop Interface: Create comparison tables, pricing tables, and pros & cons boxes in minutes with Gutenberg.
✅ No Coding Skills Needed: Build professional, customizable tables without any coding knowledge.
✅ Extensive Template Library: Choose from 50+ professionally designed templates for quick table creation.
✅ Fully Responsive Design: Ensure tables look great on all devices, from desktop to mobile.
✅ Advanced Customization Options: Customize fonts, colors, borders, and more to match your website’s design.
✅ Optimized for Performance and SEO: Boost search visibility with clean, optimized code and structured data support.
<h3>💎Check Out RioVizual Gutenberg Blocks Features</h3>
RioVizual offers a range of powerful Gutenberg blocks designed to meet all your table creation needs. Discover the unique features of each block—whether it’s building comparison tables, pricing tables, or pros and cons boxes, our blocks provide unmatched customization and flexibility.
<h4>🗝️Gutenberg Table Builder Block Includes</h4>
<ul>
<li>
Drag-and-drop table builder specifically for the Gutenberg block editor.
</li>
<li>
12 versatile table elements (text, image, button, list, icon, shortcode, media & text, icon list, icon button, dual button, star rating, divider) to create dynamic tables in WordPress. (More elements coming soon!)
</li>
<li>
29 pre-designed table templates to jumpstart your table creation process.
</li>
<li>
Right-click options for adding, deleting, copying, cutting, pasting, duplicating, and moving elements.
</li>
<li>
Comprehensive cell manipulation: insert, delete, copy, cut, paste, and more for rows and columns.
</li>
<li>
Design flexibility: style cells and elements individually or in groups.
</li>
<li>
Dynamic cell type adjustment: switch between body, header, or footer cells with ease.
</li>
<li>
Fully responsive design: make tables adapt to different screen sizes automatically.
</li>
<li>
Improved mobile viewing: make tables scrollable or stackable for smaller screens.
</li>
<li>
Customizable cell width: set fixed or flexible widths for all cells.
</li>
<li>
Freeze options: lock the first row or column for better navigation.
</li>
<li>
Cell merging and splitting: merge multiple cells into one or split them back while preserving content.
</li>
<li>
HTML tag customization: switch cell tags between “td” and “th.”
</li>
<li>
Multi-cell selection: use Ctrl to select multiple cells or Shift for selecting a range.
</li>
<li>
Extensive border settings: choose from different border types (solid, dotted, dashed, double, groove, ridge, inset, outset) for each cell.
</li>
</ul>
<h4>🗝️Gutenberg Pricing Table Block Includes</h4>
<ul>
<li>
25 pre-designed pricing table templates for quick deployment.
</li>
<li>
Responsive column controls for adaptable and mobile-friendly layouts.
</li>
<li>
Flexible row and column management: easily add, delete, or duplicate rows and columns.
</li>
<li>
7 core elements: title, price, features, star rating, divider, media and call-to-action button for compelling pricing tables.
</li>
<li>
Ribbon settings with two preset design options for highlighting offers.
</li>
<li>
Equal column height adjustment to ensure a uniform look.
</li>
<li>
Right-click functionality for quick manipulation of elements (add, delete, copy, cut, paste, duplicate, move).
</li>
<li>
Multi-cell selection for bulk operations.
</li>
<li>
Automatic mobile responsiveness for flawless performance on any device.
</li>
<li>
Custom styling options: personalize each element with global or custom design settings.
</li>
<li>
Pricing Toggle
</li>
<li>
Icon support, Tooltip, Badge with features element
</li>
<li>
Original price, Price Suffix support, Dynamic Price Slider with pricing element
</li>
<li>
Media(img/icon) support with title element.
</li>
<li>
Icon support with button element.
</li>
<li>
Background image support for column.
</li>
<li>
Featured column support.
</li>
<li>
3 more style for ribbon.
</li>
</ul>
<h4>🗝️Gutenberg Pros & Cons Block Includes</h4>
<ul>
<li>
13 pre-designed templates to easily create pros and cons boxes.
</li>
<li>
Built-in Pros and Cons Schema support to enhance SEO.
</li>
<li>
Icon customization for a personalized look.
</li>
<li>
Customization for box, title, and body.
</li>
<li>
Flexible styling: customize the box, title, and body to match your design.
</li>
<li>
Mobile support: optimized for vertical boxes on small screens.
</li>
<li>
Header and Body Item Icon Placement
</li>
<li>
Title Separator for header
</li>
<li>
Flexible Header Positioning
</li>
<li>
Enable Stripe on Body Items
</li>
<li>
Advanced Border Styles with 8 Stunning Design Pattern
</li>
<li>
Extra Design Flexibility in Style Options
</li>
</ul>
<h3>👌Creating Tables in the Gutenberg Block Editor Has Never Been Easier</h3>
Creating tables like comparison tables, pricing tables, and pros & cons tables with a WordPress table plugin has never been easier. With RioVizual, it only takes 4 simple steps:
<ul>
<li>Step 1 – Add the RioVizual Block</li>
</ul>
To insert a table into a WordPress post or page, simply add the desired RioVizual block from the Gutenberg block editor.
<ul>
<li>Step 2 – Provide Table Contents</li>
</ul>
Choose to create a table from scratch or use one of the pre-made layouts by entering your table contents.
<ul>
<li>Step 3 – Customize Your Table</li>
</ul>
Customize the table’s columns, colors, fonts, and other settings to match your design preferences. Make adjustments as needed to create a table that perfectly suits your needs.
<ul>
<li>Step 4 – Publish Your Table</li>
</ul>
Once you’re satisfied with the table’s design, click “Publish” or “Update” to make it live on your post or page.
<h3>🎓Helpful Resources</h3>
🔰 <a href="https://riovizual.com/how-to-create-table-in-wordpress/" rel="nofollow ugc">How to Create a Comparison Table in WordPress Gutenberg Block Editor?</a> 
🔰 <a href="https://riovizual.com/how-to-create-pricing-table-in-wordpress/" rel="nofollow ugc">How to Create a Pricing Table in WordPress Gutenberg Block Editor?</a> 
🔰 <a href="https://riovizual.com/how-to-create-pros-cons-table-in-wordpress/" rel="nofollow ugc">How to Create a Pros & Cons Table in WordPress Gutenberg Block Editor?</a>
<h3>💝 Love RioVizual?</h3>
⭐️ <a href="https://wordpress.org/support/plugin/riovizual/reviews/#new-post" rel="ugc">Rate Us on WordPress</a> 
👥 <a href="https://facebook.com/groups/riovizual/" rel="nofollow ugc">Join RioVizual Users Community</a> 
🌐 <a href="https://riovizual.com" rel="nofollow ugc">Visit RioVizual Website</a> 
👍 <a href="https://facebook.com/riovizual" rel="nofollow ugc">Follow RioVizual on Facebook</a>

Table Block by RioVizual – Comparison Table, Pricing Table, and Pros & Cons Box for Gutenberg

Drag and drop Gutenberg table blocks plugin for WordPress to easily create customizable, responsive tables that boost engagement and conversions.

JKL Pricing Tables vs Table Block by RioVizual – Comparison Table, Pricing Table, and Pros & Cons Box for Gutenberg