WP Table Manager documentation


WP Table Manager is a WordPress extension used to manages HTML tables in WordPress with a spreadsheet like interface. It comes as a single package all themes are included.


Main advantages:

  • Manage tables like in a spreadsheet
  • 6 themes included
  • Fully managed from any editor
  • AJAX automatic saving
  • Sortable data on frontend
  • Cell, line, column style editor
  • Resize line and column with drag'n drop
  • Copy cell with drag'n drop
  • Copy the full table in one click
  • HTML cells format
  • Advanced CSS code editor



1.1 Install


In order to install our plugin you should use standard WordPress installer or unzip and put all the folder in /wp-content/plugin.



Then click on activate plugin, to see WP Media Folder menu appear on the WordPress left menu.

WP Table manager  is accessible from a dedicated left menu or in a lightbox from the editor. You also have the parameters under the "Configuration" menu.


1.2 Update the plugin

In order to update the WP Media Folder, you can use the WordPress default updater. You can also remove and install the new version from a .zip file downloaded on www.joomunited.com. In any case you won’t lose any content because everything is database stored.



Be sure to always have the latest version to avoid security and stability problem.

To update the paid version, you need to login to your JoomUnited account from the WordPress settings: Settings > General




Then use your JoomUnited account login and password. After a successful login the button turns to blue with a text Disconnect my JoomUnited account



Then finally, you can update all the JoomUnited commercial plugins from the WordPress standard updated.




The main idea of WP Table Manager is to manage all the tables from editor although you have a plugin view. WP Table Manager works on every WordPress WYSIWYG editor, both for frontend and backend. For example you can use it in a custom WordPress module.

2.1 Manage tables from article



When WP Table Manager is installed you have an editor button that is displayed bellow your editor. Click on it to open the main WP Table Manager view.

Table manager in a lightbox opened from a post:



When you want to insert a table in your editor use the top right button Insert this table to put it in your article. Then, the table will be materialized with a grey area and an Excel like icon.



If you click on the area then on the WP Table Manager button again the table previously added will be loaded.



2.2 Manage tables and categories

Tables are classified inside categories. You can have as much tables as you want inside categories.

In order to create a table category, click on New category in the left column. To create a new table just click on the link Add new table



Note: a default category and table is already created during plugin install


The category can be managed by putting your mouse on it, you’ll be able to edit the name or delete it.



To order the categories you can use drag’n drop feature.


Putting your mouse on the table title will make appear icons to edit the table title, copy the table (all the table including data and template) or trash it.


2.3 Table edition

To add data in tables you have to act like you are in a spreadsheat. Double click on a cell will bring you the possibility to update content, a single click to select one/some cells (and to apply style for example).



To add line or columns, click on the + on the table border, or use the right click!


To copy cells you can use CTRL+C / CTRL+V (or the apple stuff that does the same J) or you can also put your mouse on the bottom right corner of the cell and bring it into the direction you want.



Note that all you’re doing is saved automatically with a message on the top right


You have an option to undo the latest modification.



WP Table Manager keeps a backup of the modification you’ve done and is able to restore it.




2.4 Advanced content edition

You can add HTML content with a WYSIWYG editor inside each cell. Select a cell, on the right part Format > HTML


Now when you edit the cell, you’ll have HTML editor inside. Image and HTML are available.



The cells can also be merged. Select 2 cells or more then do a right click, a menu will allows you to do the merging.



2.5 Excel and spreadsheet import/export

You can import and export spreadsheet in WP Table Manager by using our dedicated tool.



The tables can be imported from excel or open office documents. The format will be detected automatically and imported. Note that only the first Excel page will be imported.

The export can be done in Excel 2003 or 2007 format.





3.1 Format

The format tab is available at the right of your screen by default. It contains different parameters.



  • Cell type: default or HTML. The default type allows you to make calculation with it the HTML inserting HTML content like images. A WYSIWYG editor for every cell will be implemented in the next version, for the moment you add HTML in the cell.
  • The cell background is about defining background color of course



Borders and font options can be applied on single or multiple cells



The row and column width can be defined in pixels. Select column or row anywhere in the table and validate size.


3.2 Theme and sorting options

On the table tab, still on the right part, you have a theme chooser. Just click on a theme to apply it.

Applying a theme will replace all the data and style inside your table. So the way to proceed is to apply a theme then edit data ot create your own theme then duplicate your tables.



The 2 frame parameter is here to define the color of alternative lines (line1, line2, line1, line2...)



The sortable parameter allows you to make AJAX data sorting on frontend.



The table align is about align the div that contain the whole table, center all the table for example.



3.3 Add tooltip on cells

Cell tooltips have to be activated from the plugin configuration (Configuration menu). After activation you’ll get a button at the bottom of the format tab during the table edition



You can for a width in pixels. The edit tooltip will bring you to a tooltip with an editor to edit the tooltip.



Add content and save, you’re done, the tooltip will be displayed on public side on mouse hover.




3.4 Line and column freezing

Line or column freezing are available in the Table tab. You can freeze up to 5 line or rows



To make row freezing there’s an additional option that let you fix the height of the table (because your table container may have an infinite height).



When you have chosen the line or column to freeze, you’ll be able to scroll on your table and always displaying the fixed line/rows.



3.5 Filtering column data

A filtering option is available in the table tab again. You can activate it to enable public data filtering fields.



Example of filters



3.6 Custom CSS

Let’s go one step beyond. If you’re a webdesigner with css skills you’ll be able to add css in the More tab. You can add padding and border radius on cell.



Note that if you’ve applied a theme, some custom css will be added automatically. You can still edit it of course.


Still on the More tab, click on the custom CSS button to access to css edition. The CSS code is colored using code mirror and can be writed in less CSS, it works too!



Cells, line, columns have coordinates to identify each one and apply custom css on it. R is row, C is column.



3.7  Responsive WordPress Tables

Are my tables responsive or use the scroll on small devices?

Droptables handle the responsive design with a priority tool, as an option. By default the responsive feature is disabled, there will be an overflow (witch is working great on mobile though).



The responsive mode is advanced, you can define a priority for hiding columns on mobile sizes. When columns are hidden, a mobile menu with check box will be displayed to force the display/hide of columns. 
The column size is fixed during the table edition. If the size of all the columns is too large for the container you'll have an overflow and you'll be able to easily scroll on mobile devices.

Table with a scroll (better for a small amount of columns)


Table with column hidden (better for a big amount of columns)




4.1 Create a table with data


Since the version 2.0 you have now the possibility to add charts inside your content. First create a table with data to generate chart.


Then make you selection in order to generate chart, here all the table is selected, click on Add a new chart.



A chart will be generated, respecting the data range you’ve selected. On the right part you can select the table type. You can generate as graph as you need from a data set.



The graph will be dynamically updated regarding the data change in the table.


4.2 Graph parameters

Once your graph is added you have some options on the right column.



The “switch row/column” is only available is you have selected only numbers in the dataset. You’ll be allowed to switch data from col to row.

The “Use first row/column as labels” param allows you to add label to your graph



Then you have options to set width/height, align, color to your chart.



5.1 Sync a table with an Excel file data

It is possible to run a synchronization between a table you've created and an Excel file located on your server (anywhere). From the right tab named "Table", at the bottom you got a block to link an Excel file to the table.


If you click on the Browse button, you'll be able to select an Excel anywhere on your server, here it's a file uploaded through the media manager (/uploads folder).



Once your Excel file is linked to the table, you can hit the Fetch data button to import data from the Excel file.

Note: Only the data will be taken from Excel, not the styles, so the global style of your table will remain untouched on import.



Warning: depending of your memory available on your server, you won't be able to import very large Excel files (more than 1000 rows for example)

Then here is the result of a data import.



5.2 Synchronization with Google Sheets

WP Table Manager also offers some Google Sheets synchronization possibility. Your Google sheet has to be published to be synchronized. So first, open your sheet fromm Google Drive and publish it as web page using the File menu.



Then you'll get access to the Google Sheets file link, copy this link.



And paste into WP Table manager "Table" tab


You're done! you can now fetch data from your Google Sheet.


5.3 Automatic Excel and Google Sheets sync

Above the file link you can also activate an automatic synchronization. WP Table Manager will fetch the data automatically at a regular interval.

Once it's activated a notification is displayed after the table title.



The synchronization delay can be set in the WP Table global configuration





6.1 Parameters

To access the WP Table Manager, go in WP Table Manager > Configuration

As option you can define:

  • Enable Import/Export buttons
  • Setup importation format
  • Enable the cell tooltip option
  • Enable the auto save or activate a manual saving button





7.1 Calculation

You have a basic calculation implementation in WP Table Manager. Elements available are:

  • SUM
  • MIN
  • MAX
  • AVG      


To make a sum, type like this: =SUM(A1;B2) or =SUM(A1:B2)




WP Table Manager allows you create tables from your database tables (not only the WordPress tables but all databases).

From the admin, click on WP Table Manager > Database tables



Then you'll be able to select tables and columns from your database. By hiting control you can select several tables, columns.



On column selection you can define a custom title and a default order for your data in the table, when displayed on public side.



Then you got some options and filter to apply to your tables:

  • A pagination default level (to be used with a large amount of data)
  • Number of rows for the pagination
  • Apply some filter to your data ie. a column can be equal, different... from a defined value
  • The possibility to group some values in the columns




Finally you can preview and generate your table like any other table.

The only difference is that themes cannot be applied on tables but you can customize all the display like in any other table.


When your table is generated you will still have access to the table Database source and you can for example add a column in your table.