Most WordPress table plugins make you pick a side: simple or powerful. wpDataTables doesn’t.
Learning to insert a table with it opens up a different class of data display altogether. Sortable, filterable, responsive tables wired to live sources like Google Sheets, MySQL, and Excel.
What follows runs from installation through chart creation, front-end editing, and the errors that genuinely show up once you’re working on a real project rather than a demo. The end state is being able to create and embed any dynamic data table on your site without writing a line of code.
Table of Contents
What is wpDataTables?
It’s a WordPress table and chart plugin from Melograno Venture Studio, built for displaying, managing, and editing structured data right on your site. It hooks into external data sources, renders interactive tables, and spins up linked charts, all without custom code.
WordPress powers 43.5% of all websites as of 2025 (W3Techs), and the plugin market around it is worth $2.38 billion, growing 8.4% a year (Data Insights Market, 2025). wpDataTables sits in that ecosystem as one of the few table plugins that handles both big dynamic datasets and simple manual tables from the same interface.
It’s racked up over 80,000 active installations and a 4.6 out of 5 rating on WordPress.org, and it’s been in active development for 13 years.
What data sources does wpDataTables support?
It connects to six source types natively: Excel (.xlsx, .xls), CSV files, JSON and XML files, Google Sheets (public URL or API), MySQL and MariaDB queries, and PHP functions that return array data.
Each source produces a different kind of table. CSV and Excel tables stay static until the file is re-imported. MySQL and Google Sheets tables update dynamically as the underlying data changes.
What is the difference between the free and premium versions?
The free Lite version, available on WordPress.org, supports linked and simple tables, which covers CSV and Excel import, basic display, and simple filtering. What it doesn’t do is manual table creation, the Google Sheets API, MySQL, server-side processing, or front-end editing.
The premium side runs four paid plans, Starter, Standard, Pro, and Developer, which unlock the extra data source types, manual table creation, front-end editing (on the higher tiers), conditional formatting, server-side processing for large datasets, and chart integration. You can take them as annual subscriptions or lifetime licenses.
| Feature | Free (Lite) | Standard & above |
|---|---|---|
| CSV / Excel import | Yes | Yes |
| Google Sheets | No | Yes |
| MySQL query tables | No | Yes |
| Manual table creation | No | Yes |
| Front-end editing | No | Standard and above |
| Server-side processing | No | Yes |
What Table Creation Methods Does wpDataTables Offer?
There are four ways to create a table, and the right one comes down to where your data lives and how often it changes.
Creating a table manually in wpDataTables
Manual creation is premium-only. You build the table straight inside the WordPress admin, adding rows and columns without importing a file.
This works best for small, static datasets, pricing tables, feature comparison lists, a staff directory under 50 rows. For anything bigger, a file-linked or query-based approach is faster to keep up.
Go to wpDataTables > Create a Table, select “Create a data table manually,” then add your columns, set a data type per column, and add the rows.
The editor behaves like a stripped-down spreadsheet. Each column can be set to Text, Integer, Float, Date, or URL, which shapes how sorting and filtering work on the front end. You can also build a solid HTML table design right there by adjusting cell alignment, colors, and header styles in the same interface.
Linking wpDataTables to a file or Google Sheets
File-linked tables pull from an uploaded Excel, CSV, XML, or JSON file, or from a public Google Sheets URL.
You pick the source type, hand it the file or URL, and wpDataTables auto-detects the column headers and data types from the first row.
One thing to know going in: Google Sheets connections need the sheet to be publicly accessible. Sheets set to “restricted” or “anyone with the link” (viewer access) are fine, but private sheets fail silently. The JSON to HTML table workflow runs on the same logic, needing a publicly reachable JSON endpoint.
Creating a wpDataTables table from a MySQL query
MySQL query tables connect straight to your WordPress database, or any reachable MySQL/MariaDB database.
This is the method that sets wpDataTables apart from the basic table plugins. A query like SELECT product_name, price, stock FROM wp_products WHERE stock > 0 renders as a live, sortable, filterable table on the front end. The data reflects the actual database state at page load, or on each user interaction if you’re running server-side processing.
Server-side processing matters here. Tables above 5,000 rows should use it. Without it, the full dataset loads into the browser on every page request, and you feel the render slow down.
How to Insert a wpDataTables Table into a WordPress Page or Post
Once you’ve created a table, the plugin generates a unique shortcode, and that shortcode is how you drop the table into any page, post, or widget area.
Finding and copying the wpDataTables shortcode
The shortcode shows up the moment you save a table, in the format , where X is the numeric ID assigned automatically.
You can also track it down later under wpDataTables > All Tables, where each row in the list shows its shortcode in its own column. Copy it from there.
Inserting the table into the Gutenberg block editor
Gutenberg gives you two ways in. You can add a Shortcode block, paste , and update the page, and the table renders on the front end. Or you can search for “wpDataTables” in the block inserter, which gives you a dedicated block with a dropdown of all your tables, so you select the one you want by name instead of typing the shortcode.
Inserting the table into the Classic Editor
Paste the shortcode straight into the text area. It works in both Visual and Text (HTML) modes. The table won’t preview inside the editor itself, it only appears on the published or previewed page.
Inserting a table into widget areas or template files
For a sidebar or footer widget area, add a Text widget and paste the shortcode inside it.
For template files like page.php or a custom template, use the WordPress function echo do_shortcode('');. That’s handy when you’re building custom page templates, or when the table needs to sit inside a theme file rather than the content editor.
How to Configure Table Settings in wpDataTables
Most of the configuration lives in the table settings panel inside the WordPress admin. Each table carries its own settings, and changes apply right away to every page where that table is embedded.
Column-level settings in wpDataTables
Column settings control how each column behaves on its own, separate from the rest of the table.
| Setting | What it does |
|---|---|
| Data type | Sets sorting logic (Text, Integer, Float, Date, URL) |
| Filter type | Sets per-column filter as text input, select dropdown, or date range |
| Visibility | Hides column from front end while keeping it in the dataset |
| Alignment | Left, center, or right per column |
Column data types affect sorting accuracy. A column set to “Text” sorts alphabetically, so “10” lands before “2.” Set the numeric columns to Integer or Float to get a correct numeric sort.
Enabling server-side processing for large tables
Server-side processing moves query execution off the browser and onto the server. Instead of loading every row at once, the table only fetches the rows the current page view needs.
Turn it on under Table Settings > Advanced > Server-side Processing.
It’s only available for MySQL query tables and tables from JSON or PHP sources. It doesn’t apply to Excel or CSV-linked tables, which load their whole dataset from the file on every page request.
Sites that try to throw a 20,000-row CSV table up without server-side processing end up with tables that take 8 to 12 seconds to render and score badly on Core Web Vitals. For anything past 2,000 rows, moving the data source to MySQL makes more sense than trying to optimize a CSV import.
Enabling or disabling global table features
The Display tab on each table’s settings holds the table-wide switches. Sorting toggles per table, letting users sort by clicking a column header.
Filtering toggles per table too, showing a search row above or below the table. Pagination is configurable for rows per page, with 10, 25, 50, and 100 as the standard options.
The info block shows the “Showing 1 to 10 of 250 entries” text and can be hidden. And responsive mode sets whether the table collapses or scrolls on small screens.
How to Style a wpDataTables Table in WordPress
wpDataTables ships several built-in color themes and a set of display options inside the table editor. For anything deeper, you add CSS to your theme or child theme stylesheet.
Built-in themes and color options
There are nine built-in skins: Light, Material, Graphite, Aqua, Raspberry Cream, Purple, Dark, Mojito, and Dark Mojito. Pick one from Table Settings > Display, or set a global default under the main wpDataTables settings.
Each theme bundles the header background color, alternating row colors, border style, and font color as a single package. You can’t apply a theme halfway. If you want a custom header color while keeping a particular skin’s row styling, you override it with CSS.
Adding custom CSS to wpDataTables
Tables render with the class .wpdtSimpleTable for simple tables and .dataTable for the DataTables.net-powered ones. Target those in your child theme’s style.css or through the Customizer’s Additional CSS field.
A useful thing to keep in mind: wpDataTables inherits some styles from the active theme, particularly font-family and base font-size. If your table text looks off, check whether the theme is applying a CSS reset that’s overriding the default table styles.
For background color changes, target .wpdtSimpleTable tr:nth-child(even) for the alternating rows and .wpdtSimpleTable thead tr for the header.
Conditional formatting in wpDataTables
Conditional formatting highlights individual cells based on value rules, and it’s one of the features that separates wpDataTables from the simpler plugins.
In the column settings, you set a rule like “if value is less than 50, apply red background.” Multiple rules can stack on the same column, and they evaluate at render time, so they work on both static and dynamic tables.
It applies to numeric, text, and date column types, but not to URL or image columns.
Table footer configuration
wpDataTables supports a footer row that can show aggregate functions per column: Sum, Average, Min, Max, or Count. Enable the footer under Display settings, then set what each column’s footer cell displays.
The footer pays off on financial tables, inventory summaries, or any dataset where a column total adds immediate reading value. It renders as a standard <tfoot> element, which also helps screen readers make sense of the table structure. The 2024 updates specifically improved WCAG compliance for accessible tables, with better keyboard navigation and ARIA label support.
How to Create Responsive Tables with wpDataTables
wpDataTables gives you two responsive modes, column collapse and horizontal scroll, and both handle mobile display with no custom CSS required.
Mobile is now over 60% of global web browsing (Statista, 2024). A data table that breaks on a small screen undoes its entire reason for existing.
How column collapse works in wpDataTables
Turn it on under Table Settings > Display > Responsiveness.
Once it’s on, each column gets two switches in its settings, “Hide on tablets” and “Hide on mobiles.” The hidden columns don’t vanish entirely. They collapse under a “+” button in the first visible column of each row, expanding on tap.
Column priority matters here. The columns you hide on mobile should be secondary data, never the identifying row label. Collapse the product name column on mobile and the table turns into nonsense.
Using scrollable mode as an alternative
Scrollable mode adds a horizontal scrollbar rather than collapsing columns. Enable it through Display > Scrollable.
Worth flagging: Scrollable and “Limit table width” are mutually exclusive, so switching one on disables the other (wpDataTables documentation, 2024). For very wide tables with a lot of columns, like financial reports or database exports, scrollable mode is the more practical pick.
Known limitation with merged cells
Tables with merged cells lose their responsive behavior on mobile.
This is a DataTables.net library constraint rather than a wpDataTables bug. If your table uses colspan or rowspan merges, the responsiveness toggle does nothing. You either redesign the table without the merges, or fall back to scrollable mode.
How to Connect wpDataTables to Google Sheets
The Google Sheets connection lets you show live spreadsheet data in WordPress without manually importing files. The table reflects the sheet’s current state on each page load, subject to your caching rules.
Google changed its Sheets security policy in March 2025 and now requires API key setup for new integrations in some configurations (University of Wisconsin documentation, 2025), so it’s worth checking the current requirements before you start.
Setting up the Google Sheets connection
There are two ways to connect. The public URL method is the simpler one: share the sheet as “Anyone with the link can view,” copy the URL, and paste it into wpDataTables as the data source, though it’s limited to public sheets.
The Google Sheets API method runs through Google Cloud Console, where you create a project, enable the Sheets API, and generate credentials. That one works with private sheets and sidesteps Google’s own caching delays.
The API route takes about 10 minutes to set up, but it kills the most common complaint people have with the URL method: updates taking up to 15 minutes to appear because of Google’s cache (wpDataTables documentation, 2024).
Cache behavior and auto-update settings
wpDataTables stores Google Sheets data in the WordPress database after the first load, which is the “Cache data” feature under Display settings.
Caching cuts the repeated calls to the Google API, which has free usage limits. With a cron job set to a 15-minute interval, calls to the Sheets API drop to 4 per hour instead of one per page view (wpDataTables documentation, 2024). Switch on Auto-update cache alongside Cache data to keep the table current without clearing the cache by hand.
What breaks when the Google Sheet structure changes
Adding or removing columns after the table exists breaks the column mapping.
wpDataTables reads the column structure once, at table creation. Change the headers or the order in the sheet later and the table either shows the wrong data in the wrong columns or fails to load outright. The fix is to delete the wpDataTable and recreate it from the updated sheet. Changing cell values without touching the column structure is fine, and updates on the next cache refresh.
How to Enable Front-End Editing in wpDataTables
Front-end editing lets logged-in users add, edit, or delete table rows directly on a WordPress page, no admin panel needed. It’s available on Standard and higher plans, for manually created tables and MySQL query-based tables.
| Edit mode | How it works | Best for |
|---|---|---|
| Popup editor | Edit button opens a form overlay | Complex rows, many fields |
| Inline editing | Double-click any cell to edit in place | Quick single-cell changes |
| Popover tools | Edit buttons appear on row click | Touch-friendly interfaces |
Configuring editor roles and permissions
Go to Table Settings > Editing and enable “Allow editing.” The Editor roles dropdown lets you hand editing permission to specific WordPress user roles.
Leave “Editor roles” empty and you’ve granted editing access to everyone, including unauthenticated visitors (wpDataTables documentation, 2024). That’s almost never what you want. Assign at least the “Subscriber” role as a floor, or gate the page behind a membership plugin.
Users seeing and editing only their own data
wpDataTables supports a per-user data view. Switch on “Users see and edit only their own data” in the Editing tab.
This needs a User ID column in the MySQL or manual table. wpDataTables writes the current user’s WordPress ID into that column on every new row submission, and when the page loads, it filters the table down to the rows matching the logged-in user’s ID. The obvious use case is a client portal, where each client logs in and sees only their own orders, invoices, or project data.
How to Display Charts from wpDataTables Data
wpDataTables includes a chart wizard that ties a chart directly to table data. A chart is always linked to a specific table, so when the table data changes, the chart updates on its own.
It supports four chart rendering libraries: Chart.js, Google Charts, Highcharts, and ApexCharts. Each one brings its own chart types, styling options, and licensing terms (wpDataTables documentation, 2024).
Choosing between the 4 chart libraries
Chart.js is free, open source, and handles mobile well, which makes it the pick for straightforward bar, line, and pie charts. It moved to v4.x in recent wpDataTables releases, and that changed some of the callback structures.
Google Charts is also free, carries no extra dependencies, and renders server-side, though it needs an internet connection since it loads from Google’s CDN.
Highcharts is free for non-commercial use, and commercial use comes included free from wpDataTables version 3.0.4 onward. It’s the strongest for financial charts, stock data, and complex multi-axis visualizations. Across its libraries, wpDataTables supports 23+ chart types (InstaWP, 2024).
ApexCharts is free, MIT licensed, and has a modern visual style. It handles mobile especially well and clears 1 million downloads a month as a standalone library (wpdatatables.com, 2024), which makes it a good fit for dashboards and interactive displays.
Creating and embedding a chart
Go to wpDataTables > Create a Chart. Pick the linked table, choose a rendering library, select the chart type, then map the table columns to the chart axes.
The wizard hands you a chart shortcode separate from the table’s, in the format . You can put the table and chart on the same page with both shortcodes, or place the chart on a different page entirely. If you want the chart to react to a visitor’s filtering, switch on “Follow table filtering” in the chart settings, and it redraws in real time as someone filters the table.
What Are the Most Common wpDataTables Errors and How to Fix Them?
Most wpDataTables trouble lands in one of a few buckets: shortcode errors, caching conflicts, import failures, and PHP environment problems. Each has a specific fix.
Table not displaying on the front end
The usual culprit is a caching plugin serving up a stale version of the page.
Clear all site cache and browser cache, then exclude the pages with wpDataTables shortcodes from full-page caching in your caching plugin. WP Rocket users handle this through the “Page Cache” exclusion list. W3 Total Cache users should exclude the page URL from the Page Cache rules.
A secondary cause is a wrong table ID in the shortcode. Go to wpDataTables > All Tables, confirm the ID in the shortcode column, and fix the shortcode on the page.
CSV or Excel import fails
This usually traces to one of two things. Either it’s an encoding problem, where the file isn’t saved as UTF-8, in which case you resave it from Excel or Google Sheets with UTF-8 encoding before importing. Or it’s a column header mismatch: if you previously created the table and you’re re-importing a file with different headers, wpDataTables rejects it, because the column names in the new file have to match the original exactly.
Google Sheets not updating
The data reads stale even after you’ve edited the sheet.
First, Google’s own cache can take up to 15 minutes to propagate changes on the public URL method, so wait it out and refresh. Second, if Cache data is enabled in the wpDataTables Display settings, the plugin is serving its own cached copy, so go to wpDataTables > Settings > Cache and clear the cached table data manually, or set up Auto-update cache with a cron job interval.
White screen or PHP error after activation
This comes down to one of two root causes: server memory below 128MB, or an incompatible PHP version.
Check your current PHP memory limit under Tools > Site Health > Info > Server inside the admin. If it’s under 128MB, ask your host to bump it. For PHP version issues, wpDataTables needs PHP 7.4 minimum, though sites still on 7.4 carry a known risk since it reached end-of-life in 2022 (WP-Coder, 2024). Moving up to PHP 8.2 clears most of the compatibility-related white screen errors.
“Unknown table type” error
This one turns up when a required add-on isn’t activated, or after a failed update that left the plugin files in a mixed state.
Don’t delete the plugin to fix it. Deleting wipes all your saved table configurations. Instead, deactivate the plugin, manually upload the correct version files over FTP to replace the plugin folder, then reactivate (wpDataTables, 2022). All the table data saved in the WordPress database survives the deactivation and reactivation intact.
FAQ on How to Insert A Table in WordPress
Does wpDataTables work with the Gutenberg block editor?
Yes. wpDataTables includes a dedicated Gutenberg block. Search for “wpDataTables” in the block inserter, select your table by name, and it embeds without you typing the shortcode by hand.
Can I insert a table into a WordPress post using a shortcode?
Yes. Every table generates a unique shortcode. Paste it into any post, page, widget area, or template file, and the table renders on the front end at publish.
What is the difference between a simple table and a DataTables-powered table?
Simple tables render as static HTML. DataTables.net-powered tables add sorting, filtering, and pagination on the front end. You choose the type under Table Settings when creating a new table.
Can I insert a table in WordPress without a plugin?
Yes. The Gutenberg editor has a native Table block for basic grids. For dynamic data, sorting, or external sources like CSV or Google Sheets, a dedicated plugin like wpDataTables is necessary.
How do I display a table from an Excel file in WordPress?
Install wpDataTables, go to Create a Table, select “Link to existing data source,” choose Excel as the input type, and upload your .xlsx file. The plugin auto-detects the column headers from row one.
Why is my wpDataTables table not showing on the front end?
The usual cause is a caching plugin serving a stale page. Clear site cache, clear browser cache, then exclude the page from full-page caching in WP Rocket or W3 Total Cache.
Can multiple tables appear on the same WordPress page?
Yes. Each table has its own shortcode. Add as many shortcodes as you need on a single page. Each one loads independently with its own sorting, filtering, and pagination.
Does wpDataTables support mobile-friendly tables?
Yes. Enable Responsiveness under Display settings to collapse columns on tablets and mobiles, or use Scrollable mode for a horizontal scrollbar. Both work across every data source type.
How do I create a WordPress table from a database query?
Select “MySQL query-based table” when creating a new wpDataTable and enter your SQL query directly. The table renders the query results as a live, filterable front-end table.
Is there a free version of wpDataTables?
Yes. The Lite version is on WordPress.org. It supports linked and simple tables, including CSV and Excel import and basic display. Manual table creation, the Google Sheets API, MySQL queries, and front-end editing all need a premium plan (Standard or above).
Conclusion
This conclusion is for an article presenting how to insert a table in WordPress with wpDataTables, a plugin that handles everything from basic CSV imports to live MySQL query tables and interactive charts.
The setup is straightforward. Installation takes minutes, and the shortcode system makes embedding any responsive data table into a post or page a two-step process.
Where wpDataTables earns its place is in the details: conditional formatting, server-side processing for large datasets, front-end editing with user role permissions, and Google Sheets sync with auto-update cache.
Whether you need a sortable product table, a dynamic database table, or a linked chart, the tools are all inside one plugin.
Start with the free Lite version. Upgrade when your data demands more.
