Insert a Table Using the WYSIWYG Editor

Tables are best used to display tabular data on your page.

Tables are a complicated topic. While useful for organizing data, they can problematic if too complex. A complicated table with many columns and rows may display fine on a computer screen, but may not work well on a tablet or phone screen.

Table of Contents

1 Insert a Basic Table Via the WYSIWYG
2 Styling a Basic Table
3 Interactive Data Tables

Insert a Basic Table Via the WYSIWYG

Select the desired page in the Site Content menu on the left.
In Edit mode, scroll down your page to the desired section where you would like to place a table. e.g. on a new line after a paragraph of text.
From the Table menu hover over Table and select the number of rows and columns you would like to include in your table. Click to insert into your page.
Add your content to the blank table cells.

When saved, default tables do not include any styling or formatting.

Styling a Basic Table

With the table selected, click on the Formats drop-down, then Custom, then select one of the following table formats:

Table - All Styling (Striped, Hover, and Bordered) - A 100% full width table, with a border alternating background colors for rows, and a background color that changes when you point your mouse on row.
Table - Basic Full Width, Bordered - A 100% full width table with a border.
Table - Hovered Rows - A 100% full width table with a background color that changes when you point your mouse on row.
Table - Striped - A 100% full width table with a border and alternating background colors for rows.

You can preview table styles on our demo website.

Interactive Data Tables

There is an option to include interactive tables on any Cascade CMS site utilizing the DataTables JQuery Plugin. Data tables create the ability to condense table data in a set number of rows with pagination, include a custom search field, and column sorting abilities.

For more information see Create a Interactive Data Table in our knowledge base.