How to Create a Filterable Data Table in WordPress

Updated June 2026 • 5 min read

The fastest way to add a filterable data table in WordPress — one your visitors can search, sort, and drill into — is to collect your data with Gravity Forms and surface it with TableCrafter. No custom development, no shortcode soup. Here is exactly how to do it.

What "filterable data table" actually means in WordPress

A filterable table lets visitors narrow down rows without leaving the page. That might mean typing a name into a search bar, picking a status from a dropdown, selecting a date range, or combining several of those filters at once. Every time a filter changes, the visible rows update — either instantly in the browser or via a fast server-side query.

WordPress does not ship this natively. Page builders like Elementor can display static HTML tables, but they offer no built-in filtering. Most "table plugins" expect you to paste in a CSV or build the data inside their own editor. If your data is already living in Gravity Forms entries — which it is for most teams using WordPress for internal tools — those plugins ask you to duplicate the data manually, which means it goes stale.

TableCrafter takes a different path: it reads directly from your Gravity Forms entries and renders a live, interactive table. Filters, search, and pagination all run against the real entry data. No syncing. No exports. No duplication.

Requirements before you start

• WordPress 6.0 or higher
• Gravity Forms 2.5 or higher (the commercial form plugin)
• PHP 7.4 or higher
• TableCrafter installed (free from wordpress.org/plugins/gravity-tables/)

Step 1 — Install TableCrafter

Go to Plugins > Add New in your WordPress admin, search for gravity-tables, and install the free plugin. Activate it. You will see a new TableCrafter menu item appear in the left sidebar.

The free version includes all the filtering features covered in this guide. Pro adds inline editing and bulk operations, which are covered at the end.

Step 2 — Create a table in the admin builder

Navigate to TableCrafter > Tables > Add New. The table builder opens in a tabbed interface.

1. Form: Select the Gravity Forms form whose entries you want to display. TableCrafter reads all submitted entries for that form.
2. Columns: Drag the fields you want to show as columns. Each field from your form appears in the left panel — drag it into the column list on the right. Reorder by dragging. Remove a column by clicking the trash icon.
3. Filters: This is the tab where filtering is configured. It is covered in detail below.
4. Display: Set the default number of rows per page, enable or disable the global search bar, and choose a default sort column.
5. Permissions: Control which WordPress user roles can view the table. Leave empty for public access.

Save the table. TableCrafter assigns it a numeric ID — visible in the table list and the URL of the edit screen. If this is your first table, the ID is 1.

Step 3 — Embed the table with a shortcode

Open any page or post and add the shortcode:

[tablecrafter id="1"]

Replace 1 with your actual table config ID. Publish the page and visit it — you will see the table with your Gravity Forms entries, a search bar at the top, and sortable column headers. The filtering controls you configured in the builder appear above the table.

Step 4 — Configure filtering options

This is the core of making a table visitors can actually use. TableCrafter offers several filter types, each suited to different field types. All of these are available on the free plan.

Global search bar Free

Enabled by default. A single text input above the table that searches across all visible columns simultaneously. As the visitor types, matching rows stay visible and non-matching rows hide. The search is debounced — it waits briefly after each keystroke before running, so it does not fire on every character.

To disable it, go to the Display tab in the table builder and toggle off "Show search bar".

Per-column dropdown filters Free

For columns that contain a limited set of values — status fields, categories, dropdown choices from your Gravity Forms form — you can add a dropdown filter. In the Filters tab, click Add Filter, select the column, and choose type "Dropdown". TableCrafter automatically populates the filter options from the distinct values present in your entries.

This works well for fields like: project status (Open, In Progress, Done), department, product category, or driver name. Visitors pick one value from the dropdown and the table immediately narrows to matching rows.

Multi-select filters Free

When visitors need to filter by more than one value at once — say, showing entries from three of five locations — add a Multi-Select filter on that column. Same setup as a dropdown filter, but the type is "Multi-Select". Visitors can pick multiple options and rows matching any of their selections remain visible.

Date range filter Free

For any column mapped to a Gravity Forms date field, you can add a "Date Range" filter type. Two date pickers appear above the table labeled "From" and "To". Visitors set a range and only entries with a date in that range show. This is useful for order tables, load trackers, project trackers — any data where time-bounding is a natural way to drill in.

Text search per column Free

If the global search bar is too broad, you can add a per-column text filter. Visitors type directly into a small input above a specific column. Only that column is searched, leaving all other columns unfiltered. Useful when your table has many columns and visitors need precision — for example, searching only the "Company" column without matching the "Notes" column.

Advanced filter panel

Combining multiple filters is supported out of the box. If a visitor selects "Status = Open" from a dropdown and also types a name in the search bar, the table applies both filters together, showing only rows that match all active conditions. Filters are AND-combined by default.

Step 5 — Enable server-side pagination for large datasets

If your form has hundreds or thousands of entries, loading all of them into the browser at once creates a slow, heavy page. TableCrafter handles this with server-side pagination. Instead of sending all rows to the browser and filtering there, each page request fetches only the rows for the current page — and applies all active filters at the database level.

To enable it, go to the Display tab and turn on "Server-side processing". Then set your rows-per-page default (25, 50, 100 are common choices). When a visitor applies a filter, TableCrafter runs a query against the Gravity Forms entries table with a WHERE clause for that filter value, returning only matching rows for the current page. The total matching count appears in the pagination controls.

Step 6 — Add a column visibility picker

Free The column visibility picker lets visitors show or hide individual columns without affecting anyone else's view. It appears as a "Columns" button above the table. Visitors click it to get a checklist of all columns and toggle any off. This is particularly useful for wide tables — load trackers with 10+ columns, or employee directories where some viewers want fewer fields.

Enable it in the Display tab by toggling "Show column picker". The visitor's selection is stored in their browser session, so it persists across page reloads until they clear it.

Real-world examples

Here are a few concrete use cases where filterable tables built with TableCrafter replace custom development work:

Load tracker for a trucking company

Gravity Forms captures each load — driver, origin, destination, date, status, weight. TableCrafter displays the entries as a table with a driver dropdown filter, a status dropdown (Pending / In Transit / Delivered), and a date range filter. Dispatchers filter to this week's loads for a specific driver in two clicks.

Employee directory

HR uses a Gravity Forms entry per employee. TableCrafter renders the directory with a department dropdown, a location dropdown, and a live search on name and title. No custom code. No database table to maintain outside WordPress.

Order management view

An ecommerce team tracks wholesale orders in a Gravity Forms form. The table has dropdown filters for order status and account manager, a date range on order date, and a per-column text search on order number. The column picker lets each team member hide columns they do not need.

Pro features for interactive tables

The free plugin handles all the filtering and display described above. The Pro license at tablecrafter.com adds editing and management capabilities on top of that foundation:

• Pro Inline editing: Click any cell to edit it and save back to the Gravity Forms entry without leaving the table.
• Pro Bulk fill: Select multiple rows and set a field value across all of them at once — useful for batch status updates.
• Pro Entry duplicate: Clone an existing entry as a starting point for a new one.
• Pro Column role visibility: Show certain columns only to admins and hide them from standard users — same table, different view based on WordPress role.
• Pro Email alerts: Trigger a notification email when a cell value is changed inline.
• Pro Data bars: Render numeric columns as visual progress bars so high/low values are instantly scannable.

Quick reference: shortcode and filter setup

Once your table is built and saved, embedding it is a single line:

[tablecrafter id="1"]

For a table where you want the search bar disabled and only the per-column filters active, configure that in the admin builder — the shortcode itself does not need extra attributes for standard configurations. The builder is where filter types, column order, pagination settings, and permissions all live.