Table Block

Table Blocks

If you add the PublishPress Blocks plugin to your site, you get the Advanced Table Block. In this post, I’ll show you the basic Table Block that comes with WordPress and the one from PublishPress.

First, here’s the most basic table I could come up with that had at least a few rows and columns.

Row 1, Column 1Row 1, Column 2Row 1, Column 3
Row 2, Column 1Row 2, Column 2Row 2, Column 3
Row 3, Column 1Row 3, Column 2Row 3, Column 3
You can add a caption here

Both table blocks let you first choose how many rows and columns you need. (This can always be changed later.) Then, after you click a Create Table button, you’ll see an empty grid with a place for a caption. As you can see above, the caption isn’t very close to the table. It looks more like a new paragraph. I don’t think I’ve ever used it.

Row 1, Column 1Row 1, Column 2Row 1, Column 3
Row 2, Column 1Row 2, Column 2Row 2, Column 3
Row 3, Column 1Row 3, Column 2Row 3, Column 3
You can add a caption here

Just above is the same table, but I used the popup menu to change the text alignment. It works, but unfortunately you can’t see the change while in the editor. You have to Preview or Publish to see the new alignment.

Col1 HeaderCol2 HeaderHeader for column 3
Row 1, Column 1Row 1, Column 2Row 1, Column 3
Row 2, Column 1Row 2, Column 2Row 2, Column 3
Row 3, Column 1Row 3, Column 2Row 3, Column 3
Footer label1Footer label2Bottom label for col3
You can add a caption here

Using the column at the right of the editor, you can change the table style to stripes. You can also change the text and background colors, add column headers and footer labels, make cells fixed width (not shown above), and select Custom Styles (see below).

Row 1, Column 1Row 1, Column 2Row 1, Column 3
Row 2, Column 1Row 2, Column 2Row 2, Column 3
Row 3, Column 1Row 3, Column 2Row 3, Column 3
You can add a caption here

The table above shows the red Custom Style. The caption makes more sense here. Custom Styles are actually available for Paragraph Blocks too.)

PublishPress Advanced Table Block

And now the Advanced Table Block in its most basic form.

Row 1, Column 1Row 1, Column 2Row 1, Column 3
R2, C1R2, C2R2, C3
R3, C1R3, C2R3, C3

By default, when creating a table, the basic Table Block gives you 2 rows and columns. The Advanced Table Block gives you 3 of each. I guess PublishPress figured it’s not often that you only want a pair of rows and columns…which is probably true.

A significant difference in a basic table is that the original gives you light grey grid lines around the cells. The Advanced Table shows them in the editor but only produces top and far left lines in the end. To change this, you need to use the Border option at the right. Assuming you want all cells to have a border (likely the most common case), the best way is to click the upper left cell, hold down the Shift key, then click the lower right cell to highlight the entire table. Then go to the Borders option and click the icon to add a border to all (highlighted) cells. The options there are very similar to the ones you’ve most likely seen in Excel or a Google Sheet.

Row 1, Column 1Row 1, Column 2Row 1, Column 3
R2, C1R2, C2R2, C3
R3, C1R3, C2R3, C3

You can get funky by changing colors, styles, widths, and alignments. I’ve done a few of those things above. You can also do everything else a basic Table Block does, as you would expect.

Summary
Table Blocks
Article Name
Table Blocks
Description
How to use the Table Block and Advanced Table Block
Author
Publisher Name
The WP Inn
Publisher Logo

Leave a Comment

Your email address will not be published. Required fields are marked *