Table Component

This component has two tabs: Table Editor and Options.

Modify the default table in the component as needed. There are tools to add/remove rows and columns to expand the table. You can also paste in the contents of a table from another source (this may take a little experimentation).

Click the wrench icon to configure the settings and modify table contents.

• This component may have compatibility issues for small screen devices; e.g. mobil ephones. On small screens, the table may be wider that the screen, requiring dragging to scroll left or right.

These main settings control the table's position on the page and whether there is visual separation between the rows or columns. You cannot mark both the rows and the columns.

• Center table in column - Select to center the table within that page column. By default it will be left-justified.
  
• Styles - Adjust the borders (row/column highlights):
  • Normal (default) - Outer border plus horizontal lines between rows.
    
  • No borders
  • Horizontal stripes - Outer border plus alternating rows are shaded, starting with the first.
    
  • Vertical stripes - Outer border plus alternating columns are shaded, starting with the first.
    
  • Horizontal rules - Outer border plus a dark line between each row.
    
  • Vertical rules - Outer border plus a dark line between each column.
• ID -  Set an ID for the overal table, to act as a target for links.
  

To add content to the table, open up the component then select any table cell. You can then type directly into the cell or paste in text. When you are done, click the checkmark to save your changes (or the 'x' to cancel and close).

For rapid changes to many cells, or when you first load the table, click a cell and make any changes, then click the tab key to jump sequentially from left to right across a row. You can then tab to the start of the next next row, and so on, while Shift tab will jump you backwards. And when you reach the last cell, another tab stroke will add a new row of cells.

The component provides a Rich Text Editor for simple styling such as bold, within-cell alignment and bullets. For hyperlinks, the option is provided to open in new page. When that is selected, an additional icon will follow the linked text, to alert visitors that they will be taken to a new browser window, or even leave the current website. If the hyperlink goes to a downloadable file, an document icon will instead be shown as well as the file size if the file is on the same server.

To make these changes, select a cell in the table then click the left-most button on the toolbar. If a cell is not selected, a different dialog box will appear with table properties. Close the dialog box, select a cell, then try again. A toolbar with the following options appears:

• Insert Left - Add a column to the left of the selected cell.
• Insert Right - Add a column to the right of the selected cell.
• Delete Column - Delete the column containing the selected cell.
  
• Insert Above - Add a row above the selected cell.
  
• Insert Below - Add a row below the selected cell.
• Delete Row - Delete the row containing the selected cell.
• Merge Right - Combine the selected cell with the cell to its right.
  
• Merge Down - Combine the selected cell with the cell below it.
• Merge cells - Combines a row or column of cells. Must first use Select entire row or Select entire column. Cells should change color from white to blue.
  
• Split cell horizontally - Divide selected cell in two.
  
• Split cell vertically - Divide selected cell in two.
  
• Select entire row - Select entire row including selected cell.
  
• Select entire column - Select entire column including selected cell.
• Table - Opens a dialog box to adjust Cell Properties or Table Properties.

Authors have reported some success with pasting content from an external table (e.g. Excel) directly into a UBCMS component that is opened for editing.

Chrome currently supports this, where each Excel cell cleanly maps over to a UBCMS cell, new cells are created as needed, and incompatible formating is filtered out. We believe you first need to select a cell in the UBCMS table for it to work.

In contrast, Firefox currently tries to load the entire table into one UBCMS cell, with its formating intact, which normally causes the process to fail.

We encourage authors to try this as appropriate, since it can save a lot of work reproducing an external table, cell by cell, but we cannot guarantee these browsers will continue to perform in this way, and have not tested this procedure with multiple browsers or operating systems.