Built like a tool, not a toy.
A no-code builder, live in-place editing of entries, theme-proof rendering, style presets, and every DataTables.net feature that matters — wired straight to your Formidable forms.
The builder
A split-screen builder: controls on the left, a live preview on the right that mirrors the front end exactly. Five focused tabs — Source, Columns, Features, Theme, Embed — and the preview updates as you type, no save required.
- —Drag-and-drop column picker — drag in, drag to reorder, rename labels
- —Per-column formatting — dates, numbers, currency, text transforms, prefix/suffix (sorting stays correct)
- —Per-column default sort and responsive child-row flag
- —Live preview that uses the real front-end renderer — what you see is what ships
- —Desktop / Mobile preview toggle, with the full desktop layout scaled to fit
- —Copy-shortcode and public URL always one click away
Edit your data, in place
Turn on the Actions column and entries become editable straight from the table. Add and Edit open a modal that embeds the real Formidable form, so conditional logic, calculations, and validation all work natively.
- —Add-entry button + per-row edit and delete actions
- —Modal embeds the genuine Formidable form (every field type, full validation)
- —Permissions mirror Formidable’s own entry capabilities exactly
- —Anonymous visitors always get a clean, read-only table
- —Delete runs through Formidable’s API behind a nonce-protected endpoint
Visual PDF page builder
Design your own PDF documents — complaint forms, order confirmations, production plans — in a real page builder. Build from a form or an existing Formidable View, click fields to place them, drag to reorder, set widths to lay out side-by-side, rename every label. Live preview as you go.
- —Build from a form or point it at an existing Formidable View
- —Click your fields to add them; drag to reorder; set each element’s width for side-by-side layout
- —Calc / Formidable element: reproduce a View’s calculated columns (e.g. [frm-math], [frm-stats]) — evaluated per entry
- —Elements: fields, headings, text, calc, images, data tables, signatures, dividers, spacers, page breaks
- —Fully customizable repeating header (logo size, band height, title size/colour, alignment) + footer
- —Live PDF preview · per-row “Generate PDF” and “PDF selected”, or a [dtff_pdf_button] dropped right into a View
- —Built-in engine (mPDF) — works on free Formidable, no PDF add-on
The DataTables.net suite
Real DataTables.net features, surfaced as plain toggles. The asset loader only enqueues what each page actually uses, so unused extensions never touch your front end.
- —Global search · column sort · pagination · info row
- —Buttons — Copy · CSV · Excel · PDF · Print · Column Visibility
- —Responsive — inline expander, control column, or modal child rows
- —SearchPanes — faceted filter panes with counts
- —SearchBuilder — visual AND / OR query groups
- —FixedHeader · FixedColumns · ColReorder
- —RowGroup · RowReorder · Scroller (virtual scroll)
- —Select · KeyTable (keyboard nav) · StateRestore (saved views)
- —Row-click to expand a child row or open a modal
Styling
The front-end CSS is fully self-contained and scoped, so your tables look identical on any WordPress theme — no bleed-through, no surprises. Start from a preset, then fine-tune everything.
- —Style presets: Default · Minimal · Striped · Bordered · Dark
- —Density — comfortable, compact, spacious
- —Header and cell-content alignment — left, center, right
- —Full colour customizer: accent, text, borders, header, rows, zebra, hover, toolbar
- —Border radius, font size, and a scoped per-table custom-CSS box
Photos, files, and links
File and image fields get the treatment they deserve — thumbnails, a full-screen lightbox, file-type chips, and auto-linked contact fields.
- —Image / logo URL columns render as centered thumbnails — even URLs without a file extension
- —Click a thumbnail to open it in a full-screen lightbox
- —Non-image files show a file-type chip linking to the document
- —Email and phone fields auto-link to mailto: / tel:
- —Address fields link out to Google Maps
Mobile
Tables stay usable on phones, and you can see exactly how before you ship — the builder’s Mobile preview renders at phone width in a device frame.
- —Responsive child rows: inline expander, dedicated control column, or modal
- —Flag any column to live in the child row instead of the main grid
- —Fixed header option for long, scrolling tables
- —Mobile preview at true phone width, in a device frame
- —Lightbox and modals tuned for touch
Embed & share
Every table is a shortcode and a sharable page. It works inside Formidable Views, in any post or page, or on its own branded URL.
- —Shortcode: [dtff_table id="…"]
- —Standalone public page at /dtff/{slug}/
- —A DataTables sidebar inside the Formidable Views editor for one-click copy
- —Scoped asset loader — DataTables JS/CSS only load where a table exists
- —Automatic plugin updates via Dashboard → Updates