fbpx

Divi-Modules – Table Maker brings the convenience of responsive tables directly to the Divi builder – without the need for third-party plugins and shortcodes. Style every part of the table from content to columns, headers to footers, right down to individual cells.

Table Basics:

Tables can include any combination of table content, column header, column footer, row header, and row footer cells.

Header
Header
Header
Header
Header
Header
Content
Content
Content
Content
Footer
Header
Content
Content
Content
Content
Footer
Header
Content
Content
Content
Content
Footer
Header
Content
Content
Content
Content
Footer
Header
Footer
Footer
Footer
Footer
Footer
Table Configuration:

Tables can have multiple column and row headers and footers. Column width and row height can be set using a combination of flexible and fixed units.

01
02
03
04
05
Column 1
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Column 2-4
Column 2
Footer
Footer
Footer
Footer
Footer
Column 3
Footer
Footer
Footer
Footer
Footer
Column 4
Footer
Footer
Footer
Footer
Footer
Table Scrolling:

Tables can be set to scroll, with optional sticky column and row headers to keep headers pinned to the edge and visible at all times.

Sticky column headers:
Column 1
Alpha
Bravo
Charlie
Delta
Echo
Foxtrot
Golf
Hotel
India
Juliett
Kilo
Lima
Mike
November
Oscar
Papa
Quebec
Romeo
Sierra
Tango
Uniform
Victor
Whiskey
X-ray
Yankee
Zulu
Column 2
Alpha
Bravo
Charlie
Delta
Echo
Foxtrot
Golf
Hotel
India
Juliett
Kilo
Lima
Mike
November
Oscar
Papa
Quebec
Romeo
Sierra
Tango
Uniform
Victor
Whiskey
X-ray
Yankee
Zulu
Column 3
Alpha
Bravo
Charlie
Delta
Echo
Foxtrot
Golf
Hotel
India
Juliett
Kilo
Lima
Mike
November
Oscar
Papa
Quebec
Romeo
Sierra
Tango
Uniform
Victor
Whiskey
X-ray
Yankee
Zulu
Column 4
Alpha
Bravo
Charlie
Delta
Echo
Foxtrot
Golf
Hotel
India
Juliett
Kilo
Lima
Mike
November
Oscar
Papa
Quebec
Romeo
Sierra
Tango
Uniform
Victor
Whiskey
X-ray
Yankee
Zulu
Sticky row headers:
Row 1
Row 2
Row 3
Row 4
Alpha
Alpha
Alpha
Alpha
Bravo
Bravo
Bravo
Bravo
Charlie
Charlie
Charlie
Charlie
Delta
Delta
Delta
Delta
Echo
Echo
Echo
Echo
Foxtrot
Foxtrot
Foxtrot
Foxtrot
Golf
Golf
Golf
Golf
Hotel
Hotel
Hotel
Hotel
India
India
India
India
Juliett
Juliett
Juliett
Juliett
Kilo
Kilo
Kilo
Kilo
Lima
Lima
Lima
Lima
Mike
Mike
Mike
Mike
November
November
November
November
Oscar
Oscar
Oscar
Oscar
Papa
Papa
Papa
Papa
Quebec
Quebec
Quebec
Quebec
Romeo
Romeo
Romeo
Romeo
Sierra
Sierra
Sierra
Sierra
Tango
Tango
Tango
Tango
Uniform
Uniform
Uniform
Uniform
Victor
Victor
Victor
Victor
Whiskey
Whiskey
Whiskey
Whiskey
X-ray
X-ray
X-ray
X-ray
Yankee
Yankee
Yankee
Yankee
Zulu
Zulu
Zulu
Zulu
Table Responsiveness:

Tables can be set to display as blocks or accordion at tablet and phone size – with the option of breaking by columns or by rows. View the tables below at tablet size to see the difference.

Accordion by columns:
Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Blocks by columns:
Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Accordion by rows:
Row 1
Column 1
Alpha
Column 2
Delta
Column 3
Golf
Row 2
Column 1
Bravo
Column 2
Echo
Column 3
Hotel
Row 3
Column 1
Charlie
Column 2
Foxtrot
Column 3
India
Blocks by rows:
Row 1
Column 1
Alpha
Column 2
Delta
Column 3
Golf
Row 2
Column 1
Bravo
Column 2
Echo
Column 3
Hotel
Row 3
Column 1
Charlie
Column 2
Foxtrot
Column 3
India
Column & Row Span:

Table cells can be set to span across multiple columns and rows. Even complex table configurations, like the one below, still work beautifully at tablet and phone size.

Column 1
Column 1-2
Row 1-4
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Row 4
Delta
Row 5
Footer 1
Column 2
Column 1-2
Row 1-4
Row 1
Echo
Row 2
Foxtrot
Row 3
Golf
Row 4
Hotel
Row 5
Footer 2
Column 3
Column 3-4
Row 1-4
Row 1
India
Row 2
Juliett
Row 3
Kilo
Row 4
Lima
Row 5
Footer 3
Column 4
Column 3-4
Row 1-4
Row 1
Mike
Row 2
November
Row 3
Oscar
Row 4
Papa
Row 5
Footer 4
Column 5
Row 1-4
Row 1
Footer 1
Row 2
Footer 2
Row 3
Footer 3
Row 4
Footer 4
Row 5
Footer 5
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Column 1
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Column 2
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Column 3
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Column 4
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Sold Out
Column 5
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Table Frame:

Tables can be framed with gaps or lines. Gaps put a space between each table cell – allowing background colors and images to show through. Lines frame each cell with a solid or decorative border.

Framed by gaps:
Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Framed by lines:
Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Table Colors:

There are separate color options for table content, column headers, column footers, row headers, and row footers. There is also an option for alternating color rows. Styles can be applied table-wide, per column, or per individual cell.

Row 1
Row 2
Row 3
Row 4
Row 5
Row 6
Column 1
Content
Content
Content
Content
Content
Footer 1
Column 2
Content
Content
Content
Content
Content
Footer 2
Column 3
Content
Content
Content
Content
Content
Footer 3
Column 4
Content
Content
Content
Content
Content
Footer 4
Column 5
Content
Content
Content
Content
Content
Footer 5
Column 6
Footer 1
Footer 2
Footer 3
Footer 4
Footer 5
Footer 6
Table Text:

There are separate text options for table content, column headers, column footers, row headers, and row footers. Styles can be applied table-wide, per column, or per individual cell.

Row 1
Row 2
Row 3
Row 4
Row 5
Row 6
Column 1
Content
Content
Content
Content
Content
Footer 1
Column 2
Content
Content
Content
Content
Content
Footer 2
Column 3
Content
Content
Content
Content
Content
Footer 3
Column 4
Content
Content
Content
Content
Content
Footer 4
Column 5
Content
Content
Content
Content
Content
Footer 5
Column 6
Footer 1
Footer 2
Footer 3
Footer 4
Footer 5
Footer 6
Table Styles:

Additional styling options include horizontal and vertical text alignment, variable padding, borders, rounded-corners, box-shadows, customisable accordion toggles, and more.

Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Column 1
Row 1
Alpha
Row 2
Bravo
Row 3
Charlie
Column 2
Row 1
Delta
Row 2
Echo
Row 3
Foxtrot
Column 3
Row 1
Golf
Row 2
Hotel
Row 3
India
Row 1
Alpha
Echo
India
Row 2
Bravo
Foxtrot
Juliett
Row 3
Charlie
Golf
Kilo
Row 4
Delta
Hotel
Lima
Column 1
Alpha
Bravo
Charlie
Column 2
Delta
Echo
Foxtrot
Column 3
Golf
Hotel
India
Column 4
Juliet
Kilo
Lima