This page lets you easily create a pricing table page with HTML code. Just two simple steps, you will have the pricing table as on our demo site. Now, let’s start!

Step 1 Create a new page named Pricing Table

Just go to Dashboard >> Pages >> Add New. Here you enter your page title, select page attributes as you prefer. Please note that, you need to choose Page Template under Page Attributes pane as Page: Narrow Content.

Create Pricing Table page
Create Pricing Table page

Step 2 Write HTML code for the page

In case you have knowledge about the code, that’s great, you can make yourself a pricing table according to your taste. If you are unclear about anything, just copy/paste the following code:

 <div class="page-templage-pricing-table"> 
<div class="pricing-table grid3 style-1" data-style="style-1"> 
<div class="pt-column"> 
<div class="pt-header"><strong>Basic</strong>Great For Small Business</div> 
<div class="pt-price"><strong>$99</strong>/ month</div>
<ul> 
    <li><strong>2GB</strong> Disk space</li> 
    <li><strong>35GB</strong> Monthly Bandwidth</li> 
    <li><strong>10</strong> Widgets</li> 
    <li><strong>2 Emails</strong> Accounts</li> 
    <li><strong>10</strong> Subdomain</li> 
    <li><strong>Unlimited</strong> Databases</li> 
</ul> 
<div class="pt-footer"><a class="btn" href="#">Purchase</a></div> 
</div> 
<div class="pt-column featured"> 
<div class="pt-header"><strong>Standard</strong>Great For Medium Business</div> 
<div class="pt-price"><strong>$199</strong>/ month</div>
<ul> 
    <li><strong>50GB</strong> Disk space</li> 
    <li><strong>350GB</strong> Monthly Bandwidth</li> 
    <li><strong>10</strong> Widgets</li> 
    <li><strong>10 Emails</strong> Accounts</li> 
    <li><strong>Unlimited</strong> Subdomain</li> 
    <li><strong>Unlimited</strong> Databases</li> 
</ul> 
<div class="pt-footer"><a class="btn btn-danger" href="#">Purchase</a></div> 
</div> 
<div class="pt-column"> 
<div class="pt-header"><strong>Professional</strong>Great For Large Business</div> 
<div class="pt-price"><strong>$299</strong>/ month</div>
<ul> 
    <li><strong>100GB</strong> Disk space</li> 
    <li><strong>1000GB</strong> Monthly Bandwidth</li> 
    <li><strong>10</strong> Widgets</li> 
    <li><strong>Unlimited Emails</strong> Accounts</li> 
    <li><strong>Unlimited</strong> Subdomain</li> 
    <li><strong>Unlimited</strong> Databases</li> 
</ul> 
<div class="pt-footer"><a class="btn" href="#">Purchase</a></div> 
</div> 
</div> 
<div class="pricing-table grid4 style-2" data-style="style-2"> 
<div class="pt-column"> 
<div class="pt-header"><strong>Header</strong></div> 
<div class="pt-price"><strong>Features</strong></div> 
<ul> 
    <li>Licensed Domains</li> 
    <li>Licensed Themes</li> 
    <li>Support &amp; Update</li> 
    <li>PSD Included</li> 
    <li>Copyright Removal</li> 
</ul> 
<div class="pt-footer"><a class="button" href="#">Button</a></div> 
</div> 
<div class="pt-column"> 
<div class="pt-header"><strong>Free Theme</strong> 
Sub header</div> 
<div class="pt-price"><strong>Free!</strong></div> 
<ul> 
    <li></li> 
    <li>Free theme only</li> 
    <li><i class="icon-remove"></i></li> 
    <li><i class="icon-remove"></i></li> 
    <li><i class="icon-remove"></i></li> 
</ul> 
<div class="pt-footer"><a class="btn btn-inverse" href="#">Sign Up</a></div> 
</div> 
<div class="pt-column"> 
<div class="pt-header"><strong>Single Purchase</strong>Sub header</div> 
<div class="pt-price"><strong>$49</strong>.99</div> 
<ul> 
    <li>Unlimited</li> 
    <li>Single theme</li> 
    <li><i class="icon-ok"></i></li> 
    <li><i class="icon-remove"></i></li> 
    <li><i class="icon-remove"></i></li> 
</ul> 
<div class="pt-footer"><a class="btn btn-inverse" href="#">Sign Up</a></div> 
</div> 
<div class="pt-column featured"> 
<div class="pt-header"><strong>Bundle Purchase</strong>Sub header</div> 
<div class="pt-price"><strong>$149</strong>.99</div> 
<ul> 
    <li></li> 
    <li>All themes in bundle</li> 
    <li><i class="icon-ok"></i></li> 
    <li><i class="icon-ok"></i></li> 
    <li><i class="icon-ok"></i></li> 
</ul> 
<div class="pt-footer"><a class="btn btn-danger" href="#">Sign Up</a></div> 
</div> 
</div> 
</div>

Paste it into the Text frame of the page editor area.

Using code HTML for Pricing Table page
Using code HTML for Pricing Table page

Make sure that you press “Publish” button to save all settings, reload the website and go to front-end to see the result:

Pricing Table page
Pricing Table page