Skip to content

Beyond the Basics: Tables

 

An introduction to tables

Tables are a great tool for displaying data. Their purpose is to make that data readable, scannable and easily comparable. 

Adding a table

Step 1:

Place your cursor on the page where you want to add a table.

Step 2:

Select the table icon in the WYSIWYG Toolbar.

table icon in toolbar

Step 3:

With the dropdown selected, go to Table and insert how many columns and rows you'd like to display.

insert table

Step 4:

After your table has been created, select the table properties in the quick icons menu.

table properties quick icon

 

Step 5:

In the Class dropdown, select one of the table display options and then click Save.

table options

Note: Column headers should be created and updated through the table properties. This will ensure the column headers will be styled correctly and those who use assistive devices can accurately understand the information provided in the table.

Step 6:

Populate your content accordingly, then click Save to view changes.

save button

 

Adding and deleting rows

To add additional rows, use the quick icons menu.

Or right click on the preferred row and go to Row→ Insert Row After or Insert Row Before.

table row add

To delete a row, use the quick icons menu.

Or right click on the preferred row and go to Row→ Delete Row.

table row delete


Adding and deleting columns

To add additional columns, use the quick icons menu.

add columns quick icon menu

Or right click on the preferred row and go to Column→ Insert Column After or Insert Column Before.

insert column

To delete a column, use the quick icons menu.

delete column quick icon menu

Or right click on the preferred row and go to Column→ Delete Column.

delete column

Accessibility

Column headers should be created and updated through the table properties. This will ensure the column headers will be styled correctly and those who use assistive devices can accurately understand the information provided in the table.


Column widths can be defined using either px or % in the table properties.

Generally, percentages are recommend for column width adjustments.

To edit a table or table rows, use the table properties in the quick icons menu.

table properties

Last Updated: 9/16/24