In the edit toolbar (WYSIWYG Editor), there is a table icon. A table can be added for tabular data. Do not use tables for formatting layouts. By default, a table style is already applied on any newly created table. This style can be removed. Tables also can be transformed into a sortable, filterable table. 

How to Add a Table

1. Place your cursor in the editor where you want a table and select the table icon. It looks like a calendar grid.
2. Choose table property options. This can always be changed. Table properties include number of rows, columns, width, height, cell padding, cell spacing, headers, alignment, border size, caption, and summary. 
   Width: Please keep in mind that Drupal defaults to a "500" pixel width. To make this more suitable for responsive design, it is highly recommended to change the width to "100%" or another percentage of your choosing. 
3. Fill out the cells as necessary. Right clicking on a cell will bring up table properties as well as individual cell properties. 

Below is an example of a table with the default style. The first row has been changed to a header. It is spanning 100% width. 

Table Styles

When the cursor is placed on a cell within the table, the "Styles" drop down displays table styles. 

• No Style - There will be not style applied
• Make Table So... - This will make the table sortable and filterable 

Sortable & Filterable Tables

A table can be sorted and filtered. A header row is needed for this style to be applied. Select the "Make Table So..." option from the Styles dropdown.

Thing to Keep in Mind

• Editors will not be able to see any change within the WYSIWYG editor.
• It is not recommended to place width sizes on individual table cells or columns. Widths should only be set on the full table (found under Table Properties). Column widths will not always display correctly on load. 

Below is an example of a sortable and filterable table with a caption of "Sorted and Filtered".