Basic Tables

[table type=”basic”]

One Two Three Four Five Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit

[/table]

[toggle title=”Click here to view the above used Shortcode source”][[table type="basic"]
<thead>
<tr>
<th>One</th>
<th>Two</th>
<th>Three</th>
<th>Four</th>
<th>Five</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr class="odd">
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr class="odd">
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
</tbody>
[/table]][/toggle]

Zebra Horizontal Tables

[table type=”zebra_horizontal”]

One Two Three Four Five Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit

[/table]

[toggle title=”Click here to view the above used Shortcode source”][[table type="zebra_horizontal"]
<thead>
<tr>
<th>One</th>
<th>Two</th>
<th>Three</th>
<th>Four</th>
<th>Five</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr class="odd">
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr class="odd">
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
</tbody>
[/table]][/toggle]

Zebra Vertical Tables

[table type=”zebra_vertical”]

One Two Three Four Five Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit Lorem Ipsum dolor sit amet consectetur adipiscing elit

[/table]

[toggle title=”Click here to view the above used Shortcode source”]
[[table type="zebra_vertical"]
<colgroup>
<col class="col_odd">
<col class="even">
<col class="col_odd">
<col class="even">
<col class="col_odd">
</colgroup>

<thead>
<tr>
<th>One</th>
<th>Two</th>
<th>Three</th>
<th>Four</th>
<th>Five</th>
</tr>
</thead>
<tbody>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
<tr>
<td> Lorem Ipsum</td>
<td> dolor sit</td>
<td> amet</td>
<td> consectetur adipiscing</td>
<td> elit</td>
</tr>
</tbody>
[/table]][/toggle]

Pricing tables

Basic pricing table with active tab

[toggle title=”Click here to grab the HTML code snipplet”]
<div id="pricing_table" class="clear pricing_3_col table_w_active">

<!– #1 PRICING TABLE STARTS HERE –>
<div class="pricing_section">
<h3>Free<span>$0</span></h3>

<ul>
<li><strong>10GB</strong> Disk Space</li>
<li><strong>100GB</strong> Monthly Bandwidth</li>
<li><strong>20</strong> Email Accounts</li>
<li><strong>Unlimited</strong> subdomains</li>
</ul>

<a class="signup" href="">Sign up</a>

</div>
<!– #1 PRICING TABLE ENDS HERE –>

<!– #2 PRICING TABLE STARTS HERE –>
<div class="pricing_section pricing_active">
<h3>Advanced<span>$50</span></h3>

<ul>
<li><strong>10GB</strong> Disk Space</li>
<li><strong>100GB</strong> Monthly Bandwidth</li>
<li><strong>20</strong> Email Accounts</li>
<li><strong>Unlimited</strong> subdomains</li>
</ul>

<a class="signup" href="">Sign up</a>

</div>
<!– #2 PRICING TABLE ENDS HERE –>

<!– #3 PRICING TABLE STARTS HERE –>
<div class="pricing_section">
<h3>Enterprise<span>$125</span></h3>

<ul>
<li><strong>10GB</strong> Disk Space</li>
<li><strong>100GB</strong> Monthly Bandwidth</li>
<li><strong>20</strong> Email Accounts</li>
<li><strong>Unlimited</strong> subdomains</li>
</ul>

<a class="signup" href="">Sign up</a>

</div>
<!– #3 PRICING TABLE ENDS HERE –>

</div>
[/toggle]

Basic pricing table without active tab

[toggle title=”Click here to grab the HTML code snipplet”]
<div id="pricing_table" class="clear pricing_4_col">

<!– #1 PRICING TABLE STARTS HERE –>
<div class="pricing_section">
<h3>Free<span>$0</span></h3>

<ul>
<li><strong>10GB</strong> Disk Space</li>
<li><strong>100GB</strong> Monthly Bandwidth</li>
<li><strong>20</strong> Email Accounts</li>
<li><strong>Unlimited</strong> subdomains</li>
</ul>

<a class="signup" href="">Sign up</a>

</div>
<!– #1 PRICING TABLE ENDS HERE –>

<!– #2 PRICING TABLE STARTS HERE –>
<div class="pricing_section">
<h3>Basic<span>$25</span></h3>

<ul>
<li><strong>10GB</strong> Disk Space</li>
<li><strong>100GB</strong> Monthly Bandwidth</li>
<li><strong>20</strong> Email Accounts</li>
<li><strong>Unlimited</strong> subdomains</li>
</ul>

<a class="signup" href="">Sign up</a>

</div>
<!– #2 PRICING TABLE ENDS HERE –>

<!– #3 PRICING TABLE STARTS HERE –>
<div class="pricing_section">
<h3>Advanced<span>$50</span></h3>

<ul>
<li><strong>10GB</strong> Disk Space</li>
<li><strong>100GB</strong> Monthly Bandwidth</li>
<li><strong>20</strong> Email Accounts</li>
<li><strong>Unlimited</strong> subdomains</li>
</ul>

<a class="signup" href="">Sign up</a>

</div>
<!– #3 PRICING TABLE ENDS HERE –>

<!– #4 PRICING TABLE STARTS HERE –>
<div class="pricing_section">
<h3>Enterprise<span>$125</span></h3>

<ul>
<li><strong>10GB</strong> Disk Space</li>
<li><strong>100GB</strong> Monthly Bandwidth</li>
<li><strong>20</strong> Email Accounts</li>
<li><strong>Unlimited</strong> subdomains</li>
</ul>

<a class="signup" href="">Sign up</a>

</div>
<!– #4 PRICING TABLE ENDS HERE –>

</div>
[/toggle]