Tables

 

Overview

One of the highlights of Campusuite's editor is its robust, feature-rich table support. Right within the editor, you can create and manipulate tables with ease.

Having a quality table editor in Campusuite is key, especially since such data cannot be copied and pasted from applications like Word or Excel reliably. Not only would "text scrubbing" need to be done, but since tables can be intricate at times, it would be hard to allow a web-based conversion directly from a Word/Excel table to an HTML table.

For the most part, then, tables will need to be re-made to be entered onto a page via the Campusuite editor. If you have a large or very complex table, it may be a good idea to post it as something like a PDF document and link to it from within a page. If you plan on creating a table for explicit use on the web and first draft it in Word or Excel, it is probably not worth the extra time in being very creative with formatting of the draft, as that formatting will need to be applied again for the web version.

Campusuite's editor uses a context menu (a menu that opens when you right click) for table editing. If you right click on a part of a table at any time, you will gain access to this menu. The point of this menu is to enable you to edit and customize many aspects of the tables, such as columns, rows, and cells, with ease. If at any given time one of the items in the context menu is disabled (appears "greyed out"), then it is not possible to perform that action on the selected table.

Unlike most other editor tools that use context menus as shortcuts to performing tasks that can be done via the Editor Toolbar, all of the advanced table editing features can only be accessed via a context menu.

 

Creating a Table

It is strongly suggested that tables be made separate from other content on your page, meaning that tables should be created on their own lines, which is preceded and followed by hard breaks. Trying to insert a table in the middle of the text of a paragraph could result in issues with the layout of the content.

  1. Place your cursor on a single line that is separated from other content by hard breaks.
  2. Click the Insert/Edit Table button in the Editor Toolbar. The Table Properties dialog will be shown.
  3. Edit the fields as needed. View a description of this interface for reference. Note: If you intend to use TD Styles for your table you MUST leave the Headers set to None, and the Cell Spacing - Cell Padding - Border Size all set to Zero or blank. These will be handled by the page editor based on the TD Style you choose.
  4. Once the fields are completed, click the OK button. The table will be created and inserted into the page.

 

Editing Table Properties

  1. Right click somewhere within the bounds of the table. The Table Context Menu will open.
  2. In the menu, select the Table Properties item. The Table Properties dialog will show.
  3. Edit the fields as desired. View a description of this interface for reference. Note: If you intend to use TD Styles for your table you MUST leave the Headers set to None, and the Cell Spacing - Cell Padding - Border Size all set to Zero or blank. These will be handled by the page editor based on the TD Style you choose.
  4. Click the OK button to save the changes and update the table, or the Cancel button to leave the table as-is.

 

Deleting a Table

  1. Right click somewhere within the bounds of the table. The Table Context Menu will open.
  2. In the menu, select the Delete Table item.
  3. The table will immediately be removed from the page.

 

Manipulating Cells

When you right click on a table cell, you will also notice a Cell item in the Table Context Menu. This item will expand into another submenu, and from there, you can perform quite a few different actions in regards to the cell. If at any given time one of the items in the context menu is disabled (appears "greyed out"), then it is not possible to perform that action on the selected cell.

 

Inserting a Cell Before/After Another

Individual cells can be added into a table, but it is suggested that you keep from doing this. Tables on the web are intended to have uniform rows and columns (each row has the same number of cells as the other rows, and the same goes for colums), so adding in individual cells, will most likely cause layout or display issues with your table.

  1. Right click on the table cell where you would like to add a cell either before or after it in the row. The Table Context Menu will show.
  2. Select the Cell item. In the submenu that appears, click on the Insert Cell Before item or the Insert Cell After item, depending on where you want the cell to be placed.
  3. The new cell will immediately be created in the desired position. Its contents should be empty.

 

Deleting a Cell

Individual cells can also be removed from a table as well, but it is suggested that you keep from doing this. Manipulating single cells in a table will most likely cause layout or display issues in your table, as imbalanced cell counts in rows or columns may cause the table to not render correctly in a browser.

  1. Right click on the table cell that you would like to delete. The Table Context Menu will show.
  2. Select the Cell item. In the submenu that appears, click on the Delete Cell item.
  3. The selected cell will immediately be removed from the table.

 

Merging a Cell Right/Down

Just as in a word processor or spreadsheet application, cells in a table can be merged together to create a larger cell than spans multiple rows and/or columns.

Cells in the Campusuite editor are restricted to only merging down or to the right. This simplification does not limit your options of merging, but allows the editor to ensure a merge will create a consistent-looking table.

  1. Right click on the table cell that you want to merge with a cell that is either to the right of it or below it. The Table Context Menu will show.
  2. Select the Cell item. In the submenu that appears, click on the Merge Right item or the Merge Down item, depending on which action you wish to perform.
  3. The two cells will immediately be combined. The merging right would have created a cell that now spans multiple rows, whereas merging down would have created a cell that spans multiple columns. The content of the "new" cell will consist of the content from both cells.

 

Spliting a Cell Horizontally/Vertically

In the opposite action of merging a cell, a cell can also be split up into two different cells. This action can only be performed on a cell that has been merged and you want to split it.

Cells will be split in the cleanest possible way in the editor. This means, then, that the order a cell is split may not exactly be the order by which a set of cells was merged. If you perform a merge and immediately wish to split the cell back to the way it was, use the undo tool instead.

  1. Right click on the table cell that you want to split. The Table Context Menu will show.
  2. Select the Cell item. A horizontal split will break a cell that spans multiple columns into smaller cells that reside in their own columns, whereas a vertical split does the same, just in regards to rows. In the submenu that appears, click on the Split Cell Horizontally item or the Split Cell Vertically item, depending on which action you wish to perform.
  3. The cell will immediately be split into two cells. The content and any special styles/properties of the original cell will remain in the top-most (in a vertical split) or left-most (in a horizontal split) cell.

 

Editing a Cell's Properties

  1. Right click on the table cell that you want to edit. The Table Context Menu will show.
  2. Select the Cell item. In the submenu that appears, click on the Cell Properties item. The Cell Properties dialog will open.
  3. Edit the fields as needed. View a description of this interface for reference.
  4. Once satisfied, click the OK button to save the changes and update the cell, or click the Cancel button to return to the page without making any changes.

 

Manipulating Rows and Columns

The Campusuite editor will also allow you to manipulate whole rows/columns in a table. Using these methods to add cells or remove cells from a table is recommended, as doing so will not affect the integrity or cell per column/row balance that is so crucial to tables on the web.

 

Inserting a Row/Column Before/After Another

  1. Right click on a cell somewhere withing the bounds of the row/column that comes before or after where you want the new row/column to be. The Table Context Menu will show.
  2. Select the Row/Column item. In the submenu that appears, click on either the Insert Row/Column Before item or the Insert Row/Column After item, depending on which action you wish to perform.
  3. A new, full row/column of cells will immediately be added to the table in the desired position.

 

Deleting a Row/Column

  1. Right click on a cell somewhere withing the bounds of the row/column that comes before or after where you want the new row/column to be. The Table Context Menu will show.
  2. Select the Row/Column item. In the submenu that appears, click on the Delete Row/Column item.
  3. The selected row/column will immediately be removed from the table. The data from these cells will not be merged with other cells in the table; it will be deleted from the page entirely.