Skip to main content

Documentation: YOOtheme Elements

Extended Table Element

Extended Table Element is only available in the PRO version.
Unlock this and other features by upgrading to Joomill YOOtheme Elements PRO

The Extended Table element displays a list of items as a table, with a title, meta text, up to 5 free-form text columns, an image and a link per row. Useful for comparison tables, price lists or specification sheets.

In the YOOtheme Builder, open the element picker and look for the Joomill Extensions group of elements, then select Extended Table.

Content tab

Items Add one or more rows.
Display Show or hide the title, meta, text #1-5, image and link columns for every row without deleting the content itself.

Item

Title / Meta The row's heading and small meta text.
Text #1 to Text #5 Up to 5 independent rich text columns per row.
Image / Image Alt / Focal Point An optional image for this row.
Link / Link Text An optional link for this row, with its own text.

Settings tab

Table Style / Highlight Hovered Row / Remove Side Padding / Row Size The table's default, divider or striped style, and the padding between rows.
Order The order table cells appear in, choosing from 6 presets such as Meta, Image, Title, Text #1-5, Link, or Title, Meta, Text #1-5, Link, Image.
Vertical Alignment Vertically center the content of each table cell.
Responsive Scroll overflow (the table scrolls horizontally on small screens) or Stacked (columns stack vertically).
Last Column Alignment Align the content of the last column left, center or right.
Title / Meta / Text #1-5 Width Set each shown column's width: Expand, Shrink, Small or Medium.
Table Head Custom header text for each shown column (Title, Meta, Text #1-5, Image, Link).
Title Style / Font / Color Style the title column.
Meta Style / Color Style the meta column.
Text #1-5 Style Style each text column independently.
Image Width/Height / Loading / Border / Box Shadow / Inline SVG / Animate Strokes / SVG Color Size and style the image column.
Link Text / Attributes / Download / Nofollow / Noreferrer / Style / Size / Expand to Cell Width Style the link column.
Position, Margin, Max Width, Alignment, Text Alignment, Animation, Visibility The usual layout options shared by all Builder elements.
CSS Custom CSS for this element. Selectors .el-element, .el-item, .el-title, .el-meta, .el-text-1 to .el-text-5, .el-image and .el-link are prefixed automatically.