Insert your table html into one of the predifined table style shortcodes and it will do the job for you.
[spacer size=”15″]
[table style=”2″]
[div style=”text-align:center”]
Basic |
Professional |
Ultimate |
|
---|---|---|---|
Feature 1 |
[list style=”check”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 2 |
[list style=”check”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 3 |
[list style=”cross”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 4 |
[list style=”cross”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 5 |
[list style=”cross”]
|
[list style=”cross”]
|
[list style=”check”]
|
href="#" data-color-override="false" data-hover-color-override="false" data-hover-text-color-override="#fff">Button Text | href="#" data-color-override="false" data-hover-color-override="false" data-hover-text-color-override="#fff">Button Text | href="#" data-color-override="false" data-hover-color-override="false" data-hover-text-color-override="#fff">Button Text |
[table style="2"] [div style="text-align:center"] <table> <thead> <th></th> <th><h3>Basic</h3></th> <th><h3>Professional</h3></th> <th><h3>Ultimate</h3></th> </thead> <tbody> <tr> <td><h5>Feature 1</h5></td> <td> [list style="check"] <ul> <li>Supported</li> </ul> [/list] </td> <td> [list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td> [list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 2</h5></td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 3</h5></td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 4</h5></td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 5</h5></td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td> [list style="check"] <ul> <li>Supported</li> </ul> [/list] </td> </tr> <tr> <td></td> <td>[button link="#" color="#f6b440" size="1" style="1" dark="1" square="0" target="self"]View details[/button]</td> <td>[button link="#" color="#f6b440" size="1" style="1" dark="1" square="0" target="self"]View details[/button]</td> <td>[button link="#" color="#f6b440" size="1" style="1" dark="1" square="0" target="self"]View details[/button]</td> </tr> </tbody> </table> [/div] [/table][/spoiler] [table style=”3″] [div style=”text-align:center”]
Basic |
Professional |
Ultimate |
|
---|---|---|---|
Feature 1 |
[list style=”check”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 2 |
[list style=”check”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 3 |
[list style=”cross”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 4 |
[list style=”cross”]
|
[list style=”check”]
|
[list style=”check”]
|
Feature 5 |
[list style=”cross”]
|
[list style=”cross”]
|
[list style=”check”]
|
href="#" data-color-override="false" data-hover-color-override="false" data-hover-text-color-override="#fff">Button Text | href="#" data-color-override="false" data-hover-color-override="false" data-hover-text-color-override="#fff">Button Text | href="#" data-color-override="false" data-hover-color-override="false" data-hover-text-color-override="#fff">Button Text |
[table style="3"] [div style="text-align:center"] <table> <thead> <th></th> <th><h3>Basic</h3></th> <th><h3>Professional</h3></th> <th><h3>Ultimate</h3></th> </thead> <tbody> <tr> <td><h5>Feature 1</h5></td> <td> [list style="check"] <ul> <li>Supported</li> </ul> [/list] </td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 2</h5></td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 3</h5></td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 4</h5></td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> <td>[list style="check"] <ul> <li>Supported</li> </ul> [/list]</td> </tr> <tr> <td><h5>Feature 5</h5></td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td>[list style="cross"] <ul> <li>Not included</li> </ul> [/list]</td> <td> [list style="check"] <ul> <li>Supported</li> </ul> [/list] </td> </tr> <tr> <td></td> <td>[button link="#" color="#f6b440" size="1" style="1" dark="1" square="0" target="self"]View details[/button]</td> <td>[button link="#" color="#f6b440" size="1" style="1" dark="1" square="0" target="self"]View details[/button]</td> <td>[button link="#" color="#f6b440" size="1" style="1" dark="1" square="0" target="self"]View details[/button]</td> </tr> </tbody> </table> [/div] [/table][/spoiler]