Tables

Report pages can have tables

Report is the only content type on SF.gov that supports tables.

Build a table

If you can, use just 2 or 3 columns for your table. If you have more than 3 columns, your users will have to scroll left and right to see the complete table. This also makes it hard to view the table on a mobile phone with a small screen.

Open your Report page in Edit.

  • Find the Content component

  • Click the plus sign icon (+) under Content, then choose Table

The following fields will appear:

  • Table header options (dropdown menu)

  • Description

  • Caption

Below, there will be a button for Add column.

table component with all fields exposed

Table header options

Click the dropdown menu to see all options.

You can choose:

  • Display the first row as a header

  • Display the first column as a header

  • Display the first row AND first column as headers

  • No headers

Description

As noted, this field will display between the title (Caption) and the table.

Describe what the table is about.

Caption

This is the title of the table.

table top fields, populated

Add column

This is where you will begin to enter your data.

  • Click the Add column button

  • A green Rich text button will appear. Click that.

  • Your first column will appear, with a Column heading field at the top

From here, you will enter the headings for your columns. Use the plus sign icon at the top right of the column to add more columns.

If you need to remove columns, use the trash can icon.

Next, add rows, using the plus sign icons at the lower left of each row.

Fill in your data.

Save the page to save your table.

Here's how your table will display:

Populated table on live page

Last updated