Tables:
| Header 1 | Header 2 | Header 3 | Header 4 |
|---|---|---|---|
| Item 1 | Description | Subtotal: | $0.00 |
| Item 2 | Description | Discount: | $0.00 |
| Item 3 | Description | Shipping: | $0.00 |
| Item 4 | Description | Tax: | $0.00 |
| Item 1: | Description | TOTAL: | $0.00 |
| *Table Footer here… | |||
To use this table style just apply the following shortcode:
[toggle_content title=”Click here to see the code for the table above…”]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”]
[[custom_table]
<table class="custom-table" summary="Sample Table">
<thead>
<tr>
<th scope="col">Header 1</th>
<th scope="col">Header 2</th>
<th scope="col">Header 3</th>
<th scope="col">Header 4</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item 1</td>
<td>Description</td>
<td>Subtotal:</td>
<td>$0.00</td>
</tr>
<tr>
<td>Item 2</td>
<td>Description</td>
<td>Discount:</td>
<td>$0.00</td>
</tr>
<tr>
<td>Item 3</td>
<td>Description</td>
<td>Shipping:</td>
<td>$0.00</td>
</tr>
<tr>
<td>Item 4</td>
<td>Description</td>
<td>Tax:</td>
<td>$0.00</td>
</tr>
<tr>
<td>Item 1:</td>
<td>Description</td>
<td><strong>TOTAL:</strong></td>
<td><strong>$0.00</strong></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
*Table Footer here…
</td>
</tr>
</tfoot>
</table>
[/custom_table]][/code]
[/toggle_content]
OR for equivalent non-shortcode version apply the “custom-table” class as shown here:
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”]<table class="custom-table">…</table>[/code]
[divider_top]
Recent Comments