Add the Table Widget to a Page

Prev Next

This article will show you how to add a Table to your page.

Accessibility & Compliance Tips

  • Ensure that every cell contains data. If there is no data available for a cell, enter N/A.

  • Ensure that header row or column information applies to all information in the cells below or across from it. To check, inspect page elements, and look for the  marker in the HTML.

  • Alphabetize

  • Try to keep tables as simple and short as possible.

Who can use this feature?

System Administrator | Owner | Publisher | Author  

Instructions

  1. Sign in to your site

  2. Navigate to your desired page and ensure that Live Edit Is OnLive Edit State Toggled to ON.

  3. Select the Widgets tab widgets tab.

  4. Drag and drop the Table Widget onto your desired area of the page Drag-and-drop table widget to page.

  5. Configure the Widget Options Widget options fields.

    • Header Text: Create a title for the table

    • Heading Style: Select a style for the header

    • Option Set: Select an option set

    • Advanced:

      • Widget Breakpoint: Width at which the widget will switch from narrow to wide view

      • Push To All Versions of this Page: Add a copy of this widget to all versions of this page

      • Push To All Subpages of this Page: Add a copy of this widget to all subpages of this page

      • Push Options: Choose where to put the widget within pushed pages

  6. Configure Table Settings Widget options on the table tab.

    Note: Table Widgets auto-calculate their column width based on their contents.

    • Size: Use the grid to determine how many rows and columns there are

      • Alternate: Use the cols x rows boxes to determine rows and columns

        Note: To create a table larger than 6x6, use the cols x rows boxes

    • Header Row: Select to make the first row in the table a header row

    • Header Column: Select to make the first column in the table a header column

    • Caption (Optional): Briefly describe the table

    • Alternating Rows: Select to make the table display every other row with a slightly different background color and/or text

    • Reformat for Mobile: Select to make the table reformat to suit mobile devices

      Note: We strongly recommend this stay checked unless it makes the table format worse on mobile devices.

  7. Click the X to escape the settings x to close and save options

  8. Click inside the table to enter the table content table widget

    Note: If any cell does not have data, enter N/A. Remember that header row information applies to all cells under, and header column information applies to all cells across.

  9. Click Save Save button in the top right corner of the page.