# Table The editor offers Lovely Render’s **Advanced table** and WordPress’s **Table**. This page describes how to create an advanced table, its rows, its columns, its merged cells and its sections, then the striping of both tables. ## Choose a table The editor offers two tables. They are set in the same tabs, with the **Odd** and **Even** states to color every other row. | Block | Purpose | | --- | --- | | **Advanced table** | A table with sections (caption, header, body, footer), merged cells and cells that hold other blocks: pricing, comparisons or opening hours. Each row and each cell is styled separately. | | **Table** | The WordPress table, kept as is, with Lovely Render’s tabs and an animation. | ## Create an advanced table 1. In the editor, open the inserter and choose **Advanced table**. [Add a block](https://lovelyrender.com/documentation/add-block/) details the ways to insert a block. 2. Enter the number of **Rows** and **Columns**, 1 at minimum. 3. Turn on, if needed, **Header row**, **Footer row** and **Caption**. 4. Click **Create table**. The table appears, ready to be filled in. ![The starting screen of an Advanced table: Enter the starting number of rows and columns, the Rows and Columns fields at 3, the Header row, Footer row and Caption switches, then the Create the table button.](https://static.lovelyrender.com/uploads/2026/10/888-doc-blocs-tableau.png) ## Edit the rows Click in a cell. Its toolbar carries the row buttons. | Button | Effect | | --- | --- | | **Insert row above**, **Insert row below** | Adds a row that receives the same number of cells as its neighbor, headers included. The selection stays on the original row. | | **Delete row** | Removes the row. Inactive on the last row of a section. | On a selected row, `Ctrl+Alt+T` and `Ctrl+Alt+Y` add a row before or after it. **Note:** A cell merged downward that extends into the added row is not counted: the new row may have one cell too many. Insert the row above or below the merged area. ## Edit the columns | Button | Effect | | --- | --- | | **Insert column before** | Adds an empty column to the left of the cell, in all sections. | | **Insert column after** | Adds an empty column to the right of the cell. | | **Delete column** | Removes the cell’s column. Inactive on the last column. | A cell merged downward that crosses the added column widens instead of receiving one more cell. ## Merge cells | Button | Effect | | --- | --- | | **Merge with right cell** | The cell widens and absorbs its right neighbor. | | **Merge with cell below** | The cell lengthens and absorbs its neighbor below. | | **Split cell** | Gives back as many single cells as the merged cell covered. Inactive on a single cell. | If the absorbed cell holds content that the merge would lose, the editor asks **The other cell holds content that will be lost. Merge anyway?**, with **Merge anyway** and **Cancel**. If you move a cell from one row to another, some rows can become shorter than the others. The **Uneven rows** notice then appears, with the **Rebalance automatically** button, which adds empty cells at the end of the short rows. ## Settings tab ### Table structure panel | Setting | Effect | Default value | | --- | --- | --- | | **Caption** | Shows the caption above the table. It is written in the **Table caption…** box. | Depending on the starting screen | | **Header (thead)** | Shows the header section, whose cells title the columns. | Depending on the starting screen | | **Footer (tfoot)** | Shows the footer section, for a total or a note. | Depending on the starting screen | **Warning:** Turning a section off removes it with its content. The panel shows this reminder: **Turning a section off removes it with its content.** The table body cannot be removed. ### Cell panel | Setting | Effect | Default value | | --- | --- | --- | | **Advanced content (blocks)** | Off: a rich text field. On: the cell accepts blocks, paragraph, list, heading, Simple block, media, button or icon. | Off | | **Header cell (th)** | Makes the cell a header. | Off, on in the header | | **Scope** | The object the header titles: **Column**, **Row**, **Column group** or **Row group**. Shown for a header cell. | **Column** | Switching a cell to advanced content puts its text in a paragraph. Going back to rich text flattens its paragraphs into lines. ## Styles tab The Advanced table is set in the **Default**, **Hover**, **Odd**, **Even** and **Active** states. **Odd** styles rows 1, 3, 5 of the body, **Even** rows 2, 4, 6. 1. Select the table and open the **Styles** tab. 2. Choose the **Odd** state in the row of states. 3. In the **Colors** panel, give it a light background. Every other row takes this background. Without any setting, the table carries the **Table** style, which tints the odd rows. Each cell carries the **Table cell** style, a thin border and inner spacing. The **Tables** part of the design catalog gives a look to all the site’s advanced tables: **Striped box**, **Box**, **Striped rows**, **Rows**, **Striped** or **Borderless** ([Adopt a design from the catalog](https://lovelyrender.com/documentation/adopt-catalog-design/)). | Panel | Guide | | --- | --- | | **Colors** | [Color a block](https://lovelyrender.com/documentation/color-block/) | | **Typography** | [Style text](https://lovelyrender.com/documentation/format-text/) | | **Size & Spacing**, **Borders**, **Effects**, **Transitions** | [Set size, borders and effects](https://lovelyrender.com/documentation/size-borders-effects/) | The caption, each section, each row and each cell have these panels, in the **Default**, **Hover** and **Active** states. ## Animations tab The Advanced table and its parts have no **Animations** tab: to make the table appear, animate the [Container](https://lovelyrender.com/documentation/container-block/) that surrounds it. The WordPress **Table** has an **Animations** tab ([Animate a block](https://lovelyrender.com/documentation/animate-block/)). ## The WordPress table The **Table** block keeps WordPress’s input. Lovely Render adds the **Colors**, **Typography**, **Size & Spacing**, **Borders**, **Effects** and **Transitions** panels. The block receives the **Default**, **Hover**, **Odd**, **Even** and **Active** states, the registered styles, the **Animations** tab and the **Advanced** panel with its **HTML anchor**. The design catalog does not change it: a WordPress table keeps its look. ## On a phone The table has no scrolling of its own. For a wide table to scroll sideways in its frame on a phone, put it in a [Container](https://lovelyrender.com/documentation/container-block/). In the container’s **Size & Spacing** panel, set the **Overflow** to **Auto**. ## Accessibility - Mark the cells that title a column or a row as **Header cell (th)** and set their **Scope**. A screen reader then announces the column title with each cell. - A **Caption** gives the table its name for screen readers. - Do not use a table to put blocks side by side: a grid [Container](https://lovelyrender.com/documentation/container-block/) does it without announcing a table. ## Limits - A table always has at least one row in its body and one column. - Sections are created and removed only through the **Structure** panel. They cannot be duplicated. - The **+** of a cell only shows when the cell or one of its blocks is selected. ## See also - [Container](https://lovelyrender.com/documentation/container-block/) - [Color a block](https://lovelyrender.com/documentation/color-block/) - [Adopt a design from the catalog](https://lovelyrender.com/documentation/adopt-catalog-design/)