Table field

The table field allows the user to create and manipulate an HTML table.

General settings

Click on the button labeled "Create table" to create a new one, and a popup appears:

The popup shows you the table's general settings:

• columns - the number of columns

• rows - the number of rows

• layout - choose between horizontal and vertical

• alignment - the cells' global text alignment

• border-style - the cells' global border styles

• text color - the cells' global text color

• background-color - the background color of the cells. If you want to create a zebra effect, choose two different main and alt colors.

At the bottom you'll also find two flags:

• add header - if you want a <thead>

• add footer - if you want a <tfoot>

Click on Create once you're done.

Editing a cell

Double-click on a cell to edit it.

When editing a cell, you can navigate the other table cells by pressing the TAB key.

Adding and removing rows and columns

To add a row, click on the "+" icon on the left side of the table (where you see the numbers).

To add a column, click the "+" icon at the top of the table (where you see the letters).

To delete a row, click the "-" icon at the very end of the row.

Finally, to delete a column, click the "-" icon on top of it.

Custom Cell settings

You can override all the cell single properties.

Right-click on a cell and a contextual menu appears:

Save as template

Every table can be saved as a reusable template.

Just click on the Save as template button and a popup appears:

Select the name and save.

Import template

If you have one or more saved templates, you can always import them.

Click on the Import template button, and a popup appears:

Select the template and this will be automatically applied to the field.