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.

Column 1
Column 2-4
Column 2-4
Column 2-4
Column 1
Column 2
Column 3
Column 4
01
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Footer
Footer
Footer
02
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Footer
Footer
Footer
03
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Footer
Footer
Footer
04
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
Footer
Footer
Footer
05
Lorem ipsum dolor sit amet, per ad minim delicata consectetuer.
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
Column 2
Column 3
Column 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
Sticky row headers:
Row 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
Row 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
Row 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
Row 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
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:
Row 1
Row 2
Row 3
Column 1
Alpha
Bravo
Charlie
Column 2
Delta
Echo
Foxtrot
Column 3
Golf
Hotel
India
Blocks by columns:
Row 1
Row 2
Row 3
Column 1
Alpha
Bravo
Charlie
Column 2
Delta
Echo
Foxtrot
Column 3
Golf
Hotel
India
Accordion by rows:
Column 1
Column 2
Column 3
Row 1
Alpha
Delta
Golf
Row 2
Bravo
Echo
Hotel
Row 3
Charlie
Foxtrot
India
Blocks by rows:
Column 1
Column 2
Column 3
Row 1
Alpha
Delta
Golf
Row 2
Bravo
Echo
Hotel
Row 3
Charlie
Foxtrot
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.

Row 1-4
Row 1-4
Row 1-4
Row 1-4
Row 5
Row 1
Row 2
Row 3
Row 4
Row 5
Column 1
Column 1-2
Alpha
Bravo
Charlie
Delta
Footer 1
Column 2
Column 1-2
Echo
Foxtrot
Golf
Hotel
Footer 2
Column 3
Column 3-4
India
Juliett
Kilo
Lima
Footer 3
Column 4
Column 3-4
Mike
November
Oscar
Papa
Footer 4
Column 5
Column 5
Footer 1
Footer 2
Footer 3
Footer 4
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:
Row 1
Row 2
Row 3
Column 1
Alpha
Bravo
Charlie
Column 2
Delta
Echo
Foxtrot
Column 3
Golf
Hotel
India
Framed by lines:
Row 1
Row 2
Row 3
Column 1
Alpha
Bravo
Charlie