Overview of the Advanced Table module

This page shows you how to add the Advanced Table module to your page and explains every setting in its Content, Design and Advanced tabs, with screenshots. The Advanced Table module lets you build styled tables cell by cell, with a header row, custom colors and responsive layouts. For more details, view the demo.

How to add the Advanced Table module to your page

1. Open your page in the Divi Visual Builder.
2. Click the gray (+) icon inside a row to add a new module.
3. Search for DP Advanced Table in the module search box.
4. Click the module to insert it. Its settings open on the right.

Content tab settings

The Content tab holds the module’s own settings, grouped in the toggles below. Link, Background and Element Label are the standard Divi options.

Use Add New Advanced Table Cell to add items. Click an item in the list to open its own settings; drag items to change their order.

Configuration

• Number Of Columns: Choose how many columns should be displayed in the table.
• Column Spacing: Choose the spacing between columns.
• Row Spacing: Choose the spacing between rows.

Advanced Table Cell settings

Each advanced table cell has its own settings. Click an item in the list to open them.

Content

• Table Cell Value: Enter table single cell value.

Design tab settings

The Design tab lets you style each part of the module:

• Header: styling options for the header.
• Header Text: styling options for the header text.
• Table Cell: styling options for the table cell.
• Table Cell Text: styling options for the table cell text.
• Sizing, Spacing, Border, Box Shadow, Filters, Transform, Animation: the standard Divi design options for the whole module.

Advanced tab settings

The Advanced tab has the standard Divi options: Attributes (add a CSS class or ID), CSS, HTML, Conditions, Interactions, Visibility, Transitions, Position and Scroll Effects.