You are here

Adding a Table in the WYSIWYG

Back to Wiki

These are simple instructions to add a table to a WYSIWYG widget. The figures below show both the table properties popup and the source html of a table with the first row tags changed to "th".

Table Properties Popup in WYSIWYG

Table Properties Popup

HTML shown for an example table highlighting the first row tags

HTML of Table shown in Source code with first row tags highlighted

  1. Click the table icon. The table properties popup will appear.
  2. Add in the necessary columns and rows.
  3. Clear out "Width", "Height", "Cell Spacing", "Cell Padding", and "Border Size".
  4. Make sure "Header" is set to "None" and "Alignment" is set to "<not set>".
  5. Fill in the "Caption" with the title of the table.
  6. Optionally fill in the "Summary" if the table needs a bit of description.
  7. Click OK.
  8. The first row of your table ought to be a row of column names. If it is not, you will have a table that is not 508 compliant.
    To accomplish this, fill the first row with the column names, then either:
    • Contact web services and ask to have the first row of the table converted to use table header cells (th) OR
    • Click on the "Source" button and scroll down to find your new table in the html. Then change the first row's cells from "td" to "th".
    Unfortunately there is no button or checkbox for this setting yet, so it has to be done manually
  9. Your table is now complete and should show in the WYSIWYG, ready to have data added to the cells.