Dynamic Table element in Max Addons for Bricks Builder makes it simple to create responsive, customizable tables for your WordPress website.
From product comparisons to office schedules to pricing menus, this element provides you with the flexibility to showcase every type of data in tabular format.
With support for custom data, WordPress queries, and Google Sheets integration, you can build interactive tables with features like sorting, search, pagination, and advanced styling options.
How to Add the Dynamic Table Element#
Before you begin, make sure the following are installed and active on your WordPress site:
Once ready:
- Go to WP Dashboard >> Bricks >> Max Addons >> Elements.
- Make sure the Dynamic Table element is enabled. If it’s not, toggle the switch and click Save Changes.
- Edit or create a page using Bricks Builder.
- In the element search bar, type "dynamic table" and add it to the desired position.
- Confirm the element has the 'MAX' label in the top-left corner; this ensures it belongs to Max Addons.
Element Options#
Dynamic Table comes with two main tabs inside the Bricks editor:
- Content Tab: where you configure table data and functionality.
- Style Tab: where you design and customize the appearance.
Depending on the Source you select in the General section, different options will be available.
Content Tab Sections#
- General
- Header (only appears if Source is Custom)
- Body (only appears if Source is Custom)
- Search
- Pagination
- Header Style
- Rows Style
- Cells Style
- Icon Style
- Button Style (only appears if Source is Custom)
GENERAL#
General section is where you set up your table’s data source and core functionality.
- Source: Choose how you want to populate your table:
- Custom: Manually enter rows and columns.
- Query: Display WordPress posts dynamically.
- Google Sheets: Connect and sync data from a Google Sheet.
- Sortable Table: Enable this option to allow users to sort table data. Sorting can be done via a dropdown or by clicking column headers.
- Stack at Breakpoint: Improve mobile responsiveness by stacking table rows into a vertical layout at your chosen breakpoint.
HEADER#
If using Custom Source, the Header section allows you to:
- Add and edit table column headers.
- Assign icons or attributes to each column.
👉 Checkout: How To Customize Table Headers
BODY#
Body section is where you add the main table content (rows and columns). Learn step by step: How to Add Rows and Columns to the Table.
SEARCH#
You can also style the search box with controls for placeholder text, typography, colors, borders, background, box shadow, and spacing. To learn more checkout: How to Add a Search Box to the Table.
PAGINATION#
If your table contains large datasets, enable Pagination for better navigation.
Features include:
- Define rows per page.
- Customize Next/Previous button text.
- Show a summary of entries (e.g., “Showing 1–10 of 100 entries”).
👉 Guide: How to Add Pagination to Tables
STYLING OPTIONS#
You’ll find detailed styling controls under the Style Tab:
- Header Style: Background, padding, borders, text alignment, and more.
- Rows Style: Apply striped row styles for better readability.
- Cells Style: Customize table cell design with borders, padding, and typography.
- Icon Style: Adjust icon spacing, size, and alignment.
- Button Style (Custom Source only): Style action buttons inside your table.
👉 Check these styling tutorials:
- How to Style Table Headers in Bricks Builder
- How to Style Rows and Cells in the Dynamic Table
- How to Customize Icons and Buttons Inside the Table
Additional Resources#
Here are more tutorials to help you make the most of the Dynamic Table:
That’s it! The Dynamic Table element gives you full control over data, design, and responsiveness!