Adding and editing tables in Rich Text / HTML content items

Tables

The Rich Text Editor includes a table builder, which makes it easy to create and manage tables in your guides. Tables are best used to organize and present data and information, rather than for laying out content. Try to avoid using tables as a way to create columns inside of a box. Instead, consider using the Bootstrap grid system or the CSS grid

  1. To insert a table, place the cursor where you want the table to go and click on the Table () button.
  2. In the Table Properties window, use the options under the Table Properties tab to customize your table.
    1. Rows: enter the number of rows you want to add (you can also add more rows later).
    2. Columns: enter the number of columns you want to add (you can also add more columns later).
    3. Headers: indicate whether the first row and/or first column of the table are headers. 
    4. Caption: enter an optional caption for your table. This will display above the table in a <caption> element and can assist with making your table accessible.
      • For more info on creating accessible tables, check out WebAIM.
    5. Summary: enter an optional summary for your table (this will be included in the <table> element's summary attribute).
    6. Class: select one of the many available CSS classes to apply to your table. Each class makes it easy to apply built-in styles to your table without any extra CSS code.
  3. Optionally, you can adjust the options under the Legacy Properties tab to fine-tune your table's styles. However, fore best results, we strongly recommend you use the available CSS classes instead.
  4. Click the OK button to insert the table.
  5. Save the changes to your Rich Text/HTML content item.

Clicking the Table button

Editing the Table Properties

 Editing an existing table
  1. To edit an existing table, right-click on a table cell and select from the available options.
    1. Cell: these options allow you to insert, delete, merge, and split cells. You can also select Cell Properties, which allows you to customize things such as the height, alignment, and background color.
    2. Row: these options allow you to insert and delete rows.
    3. Column: these options allow you to insert and delete columns.
    4. Delete Table: this will completely delete the table and its contents.
    5. Table Properties: this will allow you to adjust the initial table properties, such as the headers, caption, and class.

Right-clicking to view table options

Related Articles