How to use a Table block

Use a table to make information easier to compare and scan for users. This lets users compare information in rows and columns.

How to use a Table block

A table should be used to present data (usually figures), for example Table 1:

2022 to 2023 academic year2023 to 2024 academic year
Living with your parentsUp to £8,171Up to £8,400
Living away from your parents, outside LondonUp to £9,706Up to £9,978
Living away from your parents, in LondonUp to £12,667Up to £13,022
You spend a year of a UK course studying abroadUp to £11,116Up to £11,427
If you’re 60 or over on the first day of the first academic year of your courseUp to £4,106Up to £4,221
Table 1: maximum Maintenance Loan for living costs depending on location and academic year

It is usually better to present complex written data using a List block.

To make a table accessible you must:

  • have a header row, which explains the content
  • capitalise headers
  • add a caption to the table to explain what it shows
  • do not change the background colour of the table

Find out more about how to make tables accessible.

How to add a Table block

To add an Table block to your page:

  1. Click the plus (‘+’) button to add a block to your page.
  2. Type ‘table’.
  3. Click the ‘Table’ option.
  4. Enter the number of columns you want under ‘COLUMN COUNT’ – you can change this later
  5. Enter the number of rows you want under ‘ROW COUNT’ – you can change this later
  6. Click ‘Create Table’
  7. If you can’t see the right settings sidebar, click the black ‘Settings’ button on the top right toolbar.
  8. In the right settings sidebar, click the ‘Block’ tab to make sure it’s selected.
  9. Click the ‘Header section’ button to add a top header row  
  10. Edit the text of the ‘Header labels’  (see Image 1)
  11. Click the far left of a row and press the down arrow on your keyboard
  12. Type your Row header label (see Image 1)
  13. Click the down arrow on your keyboard (or click beneath the row header) to type your next row header entry
  14. Use the arrow keys to navigate the cells of your table and add your other entries  (see Image 1)
  15. Click ‘Add caption’ to explain what the table shows

How to add more rows to a table

To add or remove rows and columns to you table:

  1. Click your table
  2. Click ‘Edit table’ on the context menu
  3. Click the row or column options you want (for example, Insert row before)
A table showing dummy entries in a table to highlighting the locations of row header labels, column header labels and entries
Image 1: example of data types in a table with header and column labels