Knowledgebase: Web Page Editor
Insert Table
Posted by on 17 December 2010 03:20 PM

Insert Table:


To insert a table click the "Table" icon (see figure 1), this will open the table window. (see figure 2)

Screenshot of the icons bar with the Insert Flash Icon spotlighted.


(figure 2)
Screenshot of the Insert Table window.

General: Under the General tab you can determine the size, alignment, borders, cell spacing and padding, and the caption of the table. The changes made to the settings under the General tab are applied to the entire table, and not individual cells.

  • Cols: Enter the number of columns (vertical) desired for your table.
  • Rows: Enter the number of rows (horizontal) desired for your table.
  • Cell Padding: Padding is the space between the walls of the cells and content inside the cells.
  • Cell Spacing: By adding spacing, empty space will inserted between the cells of the table.
  • Alignment: The alignment property determines whether the table is displayed on the page on the left, right, or centered.
  • Border: Enter a number to represent the thickness of the desired border. For example, enter a “4” will surround your table with a 4 pixel wide border. Leaving this blank will remove the border.
  • Width: Enter the desired width (in pixels) of the table.
  • Height: Enter the desired height (in pixels) of the table.
  • Class: This is an advanced field for use by webmasters who have chosen to use CSS styles and have defined a class in those styles.
  • Table Caption: Checking this option will include a space at the top of the table to include a title or caption.

Advanced: The advanced tab provides advanced web designers with options relating to the graphical design of the table and the use of style sheets (CSS).

  • Id: This is a method to identify tables with a unique name for the purposes of using javascript or other programming languages. There cannot be another table (or any other HTML tag) this ID. JavaScript uses these unique ID's to find the tables that you want to have affected by the script.
  • Summary: This optional attribute is for describing the purpose and/or structure of the table. The overview provided by the Summary attribute is particularly helpful to users of non-visual browsers. With simple tables, a good caption is usually a sufficient summary, but complex tables may benefit from a more detailed overview with the Summary attribute.
  • Style: This is used to insert a reference to style sheets being used to help define the table and/or the web page itself.
  • Language Code: This is used to designate a specific language being used when using script to define elements of the table.
  • Background Image: The table can use images for its background. Click the small folder icon to choose an image to use.
  • Frame: This drop down menu allows you to choose how the borders of frames and cells should act. For example, choosing “rows” highlights the table rows with a border and choosing “cols” would highlight each column.
  • Rules: This drop down menu provides more detail for bordering tables and/or cells within a table. For example, you can choose that only the right hand side (rhs) of the cells have a border, or just the tops of the cells. This feature comes in handy when the table needs to highlight or underline specific rows or columns.
  • Language Direction: Like the same feature on the page editor, this feature allows the use of languages that move from right to left within the table.
  • Border Color: Click the box to the right to choose the desired color for the border of the table or the cells – depending on your border options.
  • Background Color: Click the box to the right to choose the desired color for the background of the table. Choosing a table background color helps to set the table apart from the rest of the page.

*Note: Support for teaching, developing and debugging CSS is not included in the regular OurChurch.Com technical support. If you with so to use CSS and need assistance, OurChurch.Com is available to help with the purchase of maintenance hours.

When you have made a change to the properties of the table, click the "Insert" button at the bottom, of the Insert/Modify Table window.