pubydoc

<p><a href="https://pubydoc.com" title="Data Tale and Charts WordPress plugin" rel="nofollow ugc">PubyDoc Data Table and Charts WordPress plugin</a> is the data table creation platform for WordPress that allows you to create professional Data Tables and customize them with pixel-perfect precision using an intuitive visual builder. Quickly create amazing Data Tables for your users or your business with full control over every part without writing a single line of code.</p>
<h3>Now all PRO options are completely free and included in the FREE version</h3>
<p>Our team has decided to provide all the premium options of the plugin for all our users absolutely free of charge. Now you can use a truly powerful Data Table plugin without any fees.</p>
<p><a href="https://pubydoc.com/showcase/" title="Data Tale Showcase" rel="nofollow ugc">Showcase</a> | <a href="https://pubydoc.com/features/" title="PubyDoc Features" rel="nofollow ugc">Detailed Features</a> | <a href="https://pubydoc.com/documentation/" title="Documentation and FAQs" rel="nofollow ugc">Documentation and FAQs</a></p>
<ul>
<li><a href="https://pubydoc.com/features/drag-and-drop-data-table-builder/" title="Drag-and-Drop Data Table Builder" rel="nofollow ugc">Drag-and-Drop Data Table Builder</a></li>
<li><a href="https://pubydoc.com/features/different-column-types/" title="Different Column Types" rel="nofollow ugc">Different Column Types</a>. Text fields, HTML and Media support,<br />
Numeric/Currency/Percent/Date field, Button / Link field and more</li>
<li><a href="https://pubydoc.com/features/fully-customization/" title="Fully Customization" rel="nofollow ugc">Fully Customization</a>. Sorting, Searching, Pagination, Borders and Colors<br />
Row Striping and Hilighting, Merge cells, CSS and JS editor and more</li>
<li><a href="https://pubydoc.com/features/graphs-and-charts-support/" title="Graphs and Charts Support" rel="nofollow ugc">Graphs and Charts Support</a></li>
<li><a href="https://pubydoc.com/features/import-export-pdf-csv-excell-google-spreadsheet-and-mysql/" title="Import/Export Data Table and Charts" rel="nofollow ugc">Import/Export Data Table and Charts</a></li>
</ul>
<p>Data Table can be created manually in the plugin or imported from Excel, CSV, Google Sheets, and can also be synced to Google Sheets in real time. In addition, you can add data using SQL queries from a WP database or an external database.<br />
Its advanced features and user-friendly interface make the process of creating Data Tables and charts simple and efficient for users. convenient and adaptive on any type of device.<br />
Also, the plugin can display all or selected data from data tables in beautiful graphs and charts, and all settings for functions and chart design are configured in a couple of clicks and can be synchronised with data tables.</p>
<p>The PubyDoc DataTable plugin is useful for many of your table implementation needs. The plugin is essential for those who want to present huge amounts of complex data in a concise and convenient way using tables or charts. PubyDoc Data Table can help the WordPress website owner to insert a table anywhere to display any information in a tabular form that will also have effective functions for any purpose. Join our community of Data Table creators who create exceptional Data Tables with PubyDoc Data Table and Charts.</p>
<h3>Features:</h3>
<p><a href="https://pubydoc.com/features/drag-and-drop-data-table-builder/" title="Data Table Builders" rel="nofollow ugc">Drag-and-Drop Data Table Builder</a><br />
Whether you want to achieve pixel-perfect design, scale functionality and speed up your Data Table creation process, or increase your lead generation, PubyDoc has everything you need to create any type of Data Table. With instant live preview and the built-in drag and drop editor, you can design your Data Table and see exactly how it will look.<br />
Data Table and Charts is a plugin that allows you to gradually create Data Tables for any purpose, without programming skills, using a constructor convenient for you. Yes, you read that right, the plugin contains two constructors for creating tables:</p>
<ul>
<li>Simple builder. Intuitive interface consisting of several buttons. You can add and customize columns in a couple of clicks</li>
<li>Extended builder. Has a wider set of options and content settings in the table. But it’s still as easy to use as possible. If you’ve worked at Excel, then the interface will definitely be familiar.</li>
</ul>
<p><a href="https://pubydoc.com/features/fully-responsive-tables/" title="Responsive Data Table" rel="nofollow ugc">Fully Responsive Tables</a><br />
Seamlessly customize the responsiveness of Datasheets and their content and presentation of your website for each device. With Responsive Modes, you can provide the most optimized experience for every visitor, whether they are viewing your website on PC, mobile, tablets, widescreen devices, and more.</p>
<p><a href="https://pubydoc.com/features/different-column-types/" title="Different Column types" rel="nofollow ugc">Any Data Types</a><br />
Create truly unique DataTables with PubyDoc. After all, each column, or individually selected cells, can have completely different data types. For example, a plugin can create DataTables that can simultaneously be with text, pictures, video, video from the source, audio, buttons, dates, percentages, currencies, selection fields, a field for loading data, as well as add and customize unique formats using the field type html.<br />
Moreover, each of the types has the widest range of functions that can be configured for any task.</p>
<p><a href="https://pubydoc.com/documentation/4-data-table-options/" title="Data Table Customization" rel="nofollow ugc">Fully customization</a><br />
The PubyDoc Data Table plugin has the most powerful add-ons and a wide range of options to make tables truly convenient and efficient. You can enable and configure all the necessary options in one click, watching the changes immediately in a live preview.</p>
<ul>
<li>For example, enable sorting, pagination, search, which is a very handy way to quickly narrow down the results of your WordPress table.</li>
<li>Need to highlight/highlight data that fits a certain condition? No problem, just use the conditional formatting feature which can create an unlimited number of conditions at the same time.</li>
<li>Want to make the DataTable more readable and understandable? We already know all the possibilities for this, just set up: Caption; description; signature; header; footer; fixed header; fixed footer; fixed columns; Auto index – for your DataTables.</li>
<li>Or maybe give your users the ability to download / export the DataTable in the desired format directly from the front? Just specify the formats you want and export buttons for each format will show up on the front.</li>
<li>In one click, customize the data format for the entire DataTable or separately for selected cells and columns.</li>
</ul>
<p><a href="https://pubydoc.com/documentation/table-styling/" title="Data Table Style" rel="nofollow ugc">Appearance and unique design</a><br />
Once the table is created, it’s time to give it a custom look and make it more stylish.<br />
And as you may have guessed, Pubydoc has all the necessary tools for this:</p>
<ul>
<li>Auto/Fixed table width</li>
<li>Align by first table</li>
<li>wrapping settings</li>
<li>Paragraph mode settings</li>
<li>Light box and options</li>
<li>Borders and colors</li>
<li>Row striping</li>
<li>Highlighting by mouse hover/ the order column</li>
<li>Table loader</li>
<li>Advanced design options for each DataTable element.</li>
</ul>
<p><a href="https://pubydoc.com/features/graphs-and-charts-support/" title="WordPress Charts" rel="nofollow ugc">Charts</a><br />
In fact, most people prefer to visualize information. Therefore, if you want to not only display your content, but also effectively indicate its characteristics, then the PubyDoc – Data Tables and Charts WordPress plugin is what you need.<br />
PubyDoc gives you the ability to create interactive DataTables that can be turned into charts or graphs in a couple of clicks.<br />
You have many options for charts and graphs, the display of which you can easily customize in great detail, including custom design – so that they look perfect on your site. Moreover, each graph or chart can be customized individually.<br />
The plugin fully supports the following types:<br />
area chart; line chart; Pie chart; barchart; Multichart; bubble chart.</p>
<p><a href="https://pubydoc.com/documentation/how-to-optimize-large-tables/" title="Server-side-proccesing" rel="nofollow ugc">Large Tables support</a><br />
If you are building a table using the PubyDoc Data Table plugin, you have the ability to create up to 1 million cells/columns in a single table. At the same time, we have optimized the plugin so that even such an amount of data has practically no effect on the speed of DataTables. And the pagination functions, the possibility of processing on the server side, when the table is sequentially loaded ajax for each page, will make the table even faster and more efficient.<br />
Fast loading content improves the user experience. Fortunately, the PubyDoc Data Table and Charts plugin has built-in options to avoid speed issues.</p>
<p><a href="https://pubydoc.com/documentation/frontend-fields/" title="Frontend fields" rel="nofollow ugc">Editable fields</a><br />
With the PubyDoc Data Table and Charts plugin, you can create and customize fully editable DataTables. Your external users can view, edit, delete data, upload files, and save those changes to the spreadsheet. For example, own orders or inquiries, own items added to stock, etc.</p>
<p><a href="https://pubydoc.com/documentation/formulas/" title="Formulas" rel="nofollow ugc">Formulas</a><br />
Formulas are an important component of tables, they help to automatically perform all calculations and also avoid many wasted hours, days, and sometimes months of manual work. Fortunately, the PubyDoc DataTable and Charts plugin fully supports the formulas familiar to us from working with Excel.</p>
<p><a href="https://pubydoc.com/documentation/css-editor/" title="Css editor" rel="nofollow ugc">CSS and JS editor</a><br />
If you have some knowledge in programming and need point changes in how tables work, then the plugin has CSS and JS editors.</p>
<h3>Showcase:</h3>
<ul>
<li><a href="https://pubydoc.com/showcase/different-column-types/" title="Different Column Types" rel="nofollow ugc">Different Column Types</a></li>
<li><a href="https://pubydoc.com/showcase/data-table-and-charts/" title="Data Table and Charts" rel="nofollow ugc">Data Table and Charts</a></li>
<li><a href="https://pubydoc.com/showcase/product-table/" title="Product Table" rel="nofollow ugc">Product Table</a></li>
<li><a href="https://pubydoc.com/showcase/pricing-table/" title="Pricing Table" rel="nofollow ugc">Pricing Table</a></li>
<li><a href="https://pubydoc.com/showcase/media-content-in-data-table/" title="Media content in Data Table" rel="nofollow ugc">Media content in Data Table</a></li>
<li><a href="https://pubydoc.com/showcase/editable/" title="Editable data table" rel="nofollow ugc">Editable data table</a></li>
</ul>
<h3>How to create data table:</h3>
<p>Creating tables and charts with the WordPress table plugin has never been easier. It only takes 4 basic steps:</p>
<p>1.Create a data table.<br />
Create a table manually, or import tables from MS Excel, CSV in a couple of clicks. You can also import or sync spreadsheets from Google Sheets. And if you need data from the database, then you can use Custom SQL Query.</p>
<p>2.Easily edit table data:<br />
Step by step create data tables for any purpose, without programming skills, using a drag&drop constructor convenient for you.</p>
<p>3.Customization for any purpose:<br />
Just a few clicks and all the necessary options are enabled, configured and the table has a stylish appearance.</p>
<p>4.Publishing<br />
Once you’ve created and configured your table, it’s time to add it to your site. Tables, or their individual parts, are added using shortcodes. This can be done in 5 different way:<br />
Table Shortcode; Table Part Shortcode; Cell Shortcode; Value Shortcode; PHP code.</p>


PubyDoc – Data Tables and Charts

Create responsive data tables & charts with Table Builder, Excel spreadsheet or CSV. Searching, pagination, custom data table design, media support

Shiv Maikhuri

<p><strong>WSTech Visual Table Builder</strong> is a Gutenberg table builder for creating responsive pricing tables, comparison tables, feature matrices, and structured data tables without code.</p>
<p>Build tables visually with drag-and-drop editing, merged cells, templates, sorting, search, pagination, CSV import/export, and mobile display controls. Create reusable tables once and insert them anywhere with shortcodes, or build inline tables directly in Gutenberg.</p>
<h4>✨ Key Features</h4>
<p><strong>Reusable Table Management</strong><br />
* Dedicated “WSTech Tables” admin screen — create, edit, duplicate, delete<br />
* Each table gets a unique shortcode: <code>[wstech_table id="123"]</code><br />
* Embed tables in Gutenberg, Elementor, Divi, Beaver Builder, Classic Editor, or PHP templates<br />
* Slug-based shortcodes supported: <code>[wstech_table slug="pricing-table"]</code><br />
* WordPress revisions for table version history</p>
<p><strong>Editor Experience</strong><br />
* Click-to-edit cells with full rich text (bold, italic, underline, strikethrough, links)<br />
* Per-cell formatting: background colour, text colour, alignment, vertical align, padding<br />
* Tab/Shift+Tab keyboard navigation — auto-adds rows at the end<br />
* Right-click context menu for quick row/column operations<br />
* Drag & drop row and column reordering<br />
* Undo / Redo via WordPress native history (Ctrl+Z / Ctrl+Y)</p>
<p><strong>Table Structure</strong><br />
* Header row (thead), footer row (tfoot), first-column headers<br />
* Merge cells (colspan + rowspan) — Shift+click to multi-select, then merge<br />
* Unmerge any merged cell with one click<br />
* Duplicate rows and columns<br />
* Insert/delete rows and columns (above/below/before/after)<br />
* Optional table caption</p>
<p><strong>10 Built-in Templates</strong><br />
* Blank 4×4, Employee Directory, Pricing Table, Product Comparison<br />
* Invoice/Bill, Class Timetable, Sports Standings, Project Tracker<br />
* Budget Tracker, Nutrition Facts</p>
<p><strong>6 Premium Themes</strong><br />
* Default (Indigo), Striped (Sky Blue), Bordered (Slate), Dark, Minimal, Colorful</p>
<p><strong>Data Import / Export</strong><br />
* Export CSV (always available in editor)<br />
* Export JSON (.vtb.json) — full table backup including styles and settings<br />
* Import CSV — file upload or paste, auto-detects delimiter<br />
* Import JSON — restore a previously exported .vtb.json<br />
* Frontend CSV Export button (opt-in per table)</p>
<p><strong>Frontend Interactivity (instant, no page reloads)</strong><br />
* Column sorting (ASC/DESC, numeric + date-aware)<br />
* Live search / row filter<br />
* Pagination with configurable page size<br />
* Hover row highlight</p>
<p><strong>Responsive Design</strong><br />
* Horizontal scroll mode (default)<br />
* Stack on Mobile mode — each row becomes a vertical card with column labels</p>
<p><strong>Universal Compatibility</strong><br />
* Gutenberg Block Editor (native)<br />
* Elementor (Shortcode Widget)<br />
* Divi (Code Module)<br />
* Beaver Builder<br />
* Classic Editor<br />
* PHP templates: <code><?php echo do_shortcode('[wstech_table id="123"]'); ?></code></p>
<p><strong>Privacy / External Services</strong><br />
* The plugin does not send table data to external services.<br />
* Links to the plugin website and donation page are ordinary admin/readme links only.</p>
<p><strong>Source Code and Build</strong><br />
* Public source repository: https://github.com/shivmaikhuri12/wstech-visual-table-builder<br />
* Editable block source files are in the <code>src/</code> directory.<br />
* Compiled block assets are generated into the <code>build/</code> directory by <code>@wordpress/scripts</code>.<br />
* Build tools and development dependencies are declared in <code>package.json</code>.<br />
* To rebuild the production assets from source, run:</p>
<pre><code>npm install
npm run build
</code></pre>
<p><strong>Uninstall</strong><br />
* Uninstalling the plugin through WordPress removes WSTech Tables created by the plugin and their associated post meta.</p>
<h4>🔧 How to Use</h4>
<p><strong>Method 1: Reusable Tables (Recommended)</strong><br />
1. Go to <strong>WSTech Tables <span aria-hidden="true" class="wp-exclude-emoji">→</span> Add New</strong> in the admin<br />
2. Name your table and design it using the visual editor<br />
3. Click <strong>Publish</strong><br />
4. Copy the shortcode from the sidebar: <code>[wstech_table id="123"]</code><br />
5. Paste the shortcode anywhere — pages, posts, Elementor, Divi, etc.</p>
<p><strong>Method 2: Inline Tables (Quick)</strong><br />
1. In any post/page, click <strong>+ Add Block</strong> and search for “Visual Table Builder”<br />
2. Design your table directly in the post<br />
3. Save the post — your table is live!</p>
<h3>Features</h3>
<h4>Drag & Drop Table Builder</h4>
<p>Build tables directly in the WordPress editor using a visual grid. Click any cell to edit content, use toolbar controls for common formatting, and reorder rows or columns with drag and drop controls. The editor is designed for people who need spreadsheet-style table control without writing HTML.</p>
<h4>Merge Cells</h4>
<p>Create more advanced table layouts with colspan and rowspan support. Select a rectangular group of cells, merge them into one larger cell, and unmerge later when the layout needs to change. This is useful for pricing tables, schedules, invoice totals, grouped comparison rows, and table headings.</p>
<h4>Responsive Tables</h4>
<p>Choose between horizontal scroll mode and Stack on Mobile mode. Horizontal scroll keeps wide tables intact on smaller screens, while Stack on Mobile turns rows into compact vertical cards with column labels.</p>
<h4>CSV Import and Export</h4>
<p>Import CSV files from Excel, Google Sheets, LibreOffice, or pasted spreadsheet data. Export CSV from the editor, and optionally enable a frontend CSV export button for visitors when a table needs downloadable data.</p>
<h4>JSON Backup and Restore</h4>
<p>Export a full <code>.vtb.json</code> backup that includes table content, merged cells, styles, captions, responsive settings, sorting, search, pagination, and other table options. Import the JSON file later to restore the table state.</p>
<h4>Reusable Tables</h4>
<p>Create tables in <strong>WSTech Tables <span aria-hidden="true" class="wp-exclude-emoji">→</span> Add New</strong>, publish them once, and embed them across multiple pages. Updating the saved table updates every shortcode instance automatically.</p>
<h4>Shortcodes</h4>
<p>Embed reusable tables with <code>[wstech_table id="123"]</code> or <code>[wstech_table slug="pricing-table"]</code>. Shortcodes work in posts, pages, widgets, Classic Editor, Elementor, Divi, Beaver Builder, and PHP templates.</p>
<h4>Search and Pagination</h4>
<p>Enable live search to help visitors filter table rows instantly. Enable pagination when a table has many rows and should be split into smaller page sets.</p>
<h4>Templates</h4>
<p>Start faster with built-in templates including blank table, employee directory, pricing table, product comparison, invoice, class timetable, sports standings, project tracker, budget tracker, and nutrition facts.</p>
<h4>Gutenberg Integration</h4>
<p>Use the native <strong>Visual Table Builder</strong> block for inline tables, or use the WordPress Shortcode block to insert reusable tables created from the WSTech Tables admin screen.</p>
<h3>Docs</h3>
<h4>Creating a Reusable Table</h4>
<p>Reusable tables are best when the same table needs to appear in more than one place. Create the table under <strong>WSTech Tables</strong>, publish it, and use its shortcode anywhere. When the table is edited later, all embedded instances update automatically.</p>
<h4>Creating an Inline Gutenberg Table</h4>
<p>For a table that only belongs to one post or page, add the <strong>Visual Table Builder</strong> block directly in the Gutenberg editor. Inline tables are stored with the post content.</p>
<h4>Importing CSV Data</h4>
<p>Use <strong>Import <span aria-hidden="true" class="wp-exclude-emoji">→</span> CSV</strong> in the table toolbar. You can upload a CSV file or paste CSV text. The importer detects common delimiters such as commas, tabs, semicolons, and pipes.</p>
<h4>Exporting Table Data</h4>
<p>Use CSV export when you need spreadsheet-compatible data. Use JSON export when you need a full backup of table content, styles, merged cells, and display settings.</p>
<h4>Frontend Data Controls</h4>
<p>Sorting, search, pagination, hover highlighting, and frontend CSV export are optional per table. Enable only the features each table needs.</p>
<h4>Responsive Display</h4>
<p>Use horizontal scroll for wide technical or comparison tables. Use Stack on Mobile for directory, pricing, or feature-list tables where each row should become a readable mobile card.</p>
<h3>Shortcodes</h3>
<h4>Embed by Table ID</h4>
<pre><code>[wstech_table id="123"]
</code></pre>
<p>This is the recommended shortcode because the numeric ID does not change.</p>
<h4>Embed by Table Slug</h4>
<pre><code>[wstech_table slug="pricing-table"]
</code></pre>
<p>This is useful for readable shortcodes. If the table slug changes, update the shortcode.</p>
<h4>Use in PHP Templates</h4>
<pre><code><?php echo do_shortcode( '[wstech_table id="123"]' ); ?>
</code></pre>
<h4>Where Shortcodes Work</h4>
<ul>
<li>WordPress Shortcode block</li>
<li>Classic Editor</li>
<li>Elementor Shortcode widget</li>
<li>Divi Code module</li>
<li>Beaver Builder shortcode/HTML module</li>
<li>Widget areas that support shortcodes</li>
<li>Theme templates with <code>do_shortcode()</code></li>
</ul>
<h4>Shortcode Troubleshooting</h4>
<p>If a shortcode does not display a table, confirm that the table exists, is published, and that the shortcode ID or slug is correct.</p>
<h3>Developer Notes</h3>
<p><strong>Data Model:</strong> Tables are stored as JSON in post meta (<code>_wstech_table_data</code>) with a <code>version</code> field for future migration support.</p>
<p><strong>Rendering:</strong> A shared PHP renderer (<code>WSTech_Table_Renderer</code>) generates frontend HTML for both Gutenberg blocks (via <code>render_callback</code>) and shortcodes.</p>
<p><strong>Block Name:</strong> The Gutenberg block namespace is <code>vtb/table-builder</code> (stable, will not change).</p>
<p><strong>Building from source:</strong><br />
    <code>cd wp-content/plugins/wstech-visual-table-builder<br />
npm install<br />
npm run build</code></p>


WSTech Visual Table Builder

Build responsive pricing tables, comparison tables, feature matrices and data tables with drag-and-drop editing, templates, sorting and search.

PubyDoc – Data Tables and Charts vs WSTech Visual Table Builder