Build Incredible Layouts using these Styles

Different Price Table Examples

First

  • Free!
  • 1 User
  • 3 Templates
  • 3 Reports
  • 100MB Storage
  • Sign Up

Second

  • $9per month
  • 1 User
  • 10 Templates
  • 20 Reports
  • 200MB Storage
  • Sign Up

Fourth

  • $69per month
  • 20 User
  • Unlimited Templates
  • Unlimited Reports
  • 1GB Storage
  • Sign Up

Fifth

  • $199per month
  • 60 User
  • Unlimited Templates
  • Unlimited Reports
  • 4GB Storage
  • Sign Up

 

First

  • Free!
  • 1 User
  • 3 Templates
  • 3 Reports
  • 100MB Storage
  • Sign Up

Third

  • $24per month
  • 5 User
  • Unlimited Templates
  • Unlimited Reports
  • 500MB Storage
  • Sign Up

Fourth

  • $69per month
  • 20 User
  • Unlimited Templates
  • Unlimited Reports
  • 1GB Storage
  • Sign Up

 

First

  • Free!
  • 1 User
  • 3 Templates
  • 3 Reports
  • 100MB Storage
  • Sign Up

Third

  • $24per month
  • 5 User
  • Unlimited Templates
  • Unlimited Reports
  • 500MB Storage
  • Sign Up

Price Table shortcode instructions

Every Price Table begins with the [price_table] shortcode that sets the number of columns to be displayed. Example usage:

[price_table columns="3"]
...
...
...
[/price_table]

Inside the [price_table] shortcode you add [price_column] shortcodes for each specific column of the price table. This shortcode can have the 3 following arguments:

Example usage:

[price_table columns="3"]
[price_column title="First" color="spring-blue"]
<li>[price_tag value="Free!" /]</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li>[button text="Sign Up" url="http://www.google.com/"]</li>
[/price_column]
[price_column featured="true" title="Second" color="spring-green"]
<li>[price_tag value="$10" period="per month" /]</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li>[button text="Sign Up" url="http://www.google.com/"]</li>
[/price_column]
[price_column title="Third" color="red"]
<li>[price_tag value="$20" period="per month" /]</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li><strong>dolor</strong> sit</li>
<li>[button text="Sign Up" url="http://www.google.com/"]</li>
[/price_column]
[/price_table]

Inside the [price_column] shortcode you add the lines of text inside <li> tags and you can use the [price_tag] shortcode to show the price for that individual column. Example usage:

[price_tag value="$10" period="per month" /]