Please wait...

Creating Tables in WordPress based on serialized PHP arrays

Video versionA video overview of PHP array-based wpDataTables

Example of a PHP array-based wpDataTablewpDataTables Table created from PHP array

The format of the serialized array should be the following: 2D-array, where the parent level is an indexed array, and the second level is an associative array. Parent array entries will be parsed as rows, child array keys will be parsed as column headers, child array values as cell values.

If you’re a developer, or at least know something about PHP, you may find that standard input data types (Google Spreadsheet, Excel, CSV, MySQL query) are not flexible enough for you. You may want to prepare the table data “on the fly”, for example depending on some variables in the URL, or  use some other complex logic. We did not want to limit your freedom with wpDataTables, so we introduced serialized PHP arrays as one of the data source alternatives.

In this example we are going to prepare a PHP file that returns ID’s, titles, and text previews from this documentation section using WP_Query. This can also be considered as a demo of WordPress integration.

Let’s see the resulting table first, and then steps how to prepare it.

Please note: if your data set is really large (many thousands of rows) serialized PHP format for creating a wpDataTable would not be a good solution since the page generation time and size would significantly increase. MySQL-based wpDataTables with server-side processing is the best option for large datasets.

Instructions to create the table

<?php

// Initializing the WordPress engine in a stanalone PHP file
include('../wp-blog-header.php');

// Preparing a WP_query
$the_query = new WP_Query(
array(
'post_type' => 'page', // We only want pages
'post_parent' => 244, // We only want children of a defined post ID
'post_count' => -1 // We do not want to limit the post count
// We can define any additional arguments that we need - see Codex for the full list
)
);

$return_array = array(); // Initializing the array that will be used for the table

while( $the_query->have_posts() ){

// Fetch the post
$the_query->the_post();

// Filling in the new array entry
$return_array[] = array(
'Id' => get_the_id(), // Set the ID
'Title' => get_the_title(), // Set the title
'Content preview with link' => get_permalink().'||'.strip_tags( strip_shortcodes( substr( get_the_content(), 0, 200 ) ) ).'...'
// Get first 200 chars of the content and replace the shortcodes and tags
);

}

// Now the array is prepared, we just need to serialize and output it
echo serialize( $return_array );

?>

First thing to do is to prepare a PHP file that fetches and returns the data that we want.

In this example we prepared a standalone PHP file that uses WordPress WP_Query method to fetch all pages that belong to documentation, and returns a serialized array that can be used to generate a table. You can have a look at the code at the left.

When the code is prepared, paste it to some PHP file and copy the URL to use it in the next step.

Create a new wpDataTable and paste your PHP file location

Create a table linked to an existing data source

1. Go to wpDataTables -> Create a Table and choose Create a table linked to an existing data source option.

serialized php array input

2. Define a name for your new wpDataTable in the input which will help you to find it later.
3. Choose “Serialized PHP array” option in the “Input data source type” select box.
4. Paste the URL of the PHP file that you prepared in step 1 to the “Input file or URL” input field.
5. Press “Apply” so that wpDataTables would read the table data and initialize the columns metadata from the provided URL.

(Optional) - Define additional settings for the table and columns

column type url

After you clicked “Apply” for the first time wpDataTable is already created, and available to be inserted in posts or pages, but you might want to define some additional settings for the table in general, or some of its columns. For this table above we defined only one additional setting: set “Content preview with link” column type to “URL link“.

When you’ve done with configuration, click “Apply” once again so wpDataTables would store them.

Insert your PHP array based wpDataTable in a WordPress post or page

Inserting wpDataTables shortcode on page or post

Now the table is prepared and the only thing we need to do is to insert it to our post or page.

  1. Open or create a new post or page.
  2. Put the cursor in the position where you would like to place the wpDataTable.
  3. Click the “Insert wpDataTable” button in the editor.
  4. Locate the wpDataTable that you created in the steps 1-3 and click OK.
  5. Save the post or page and open it in the front-end to see the result.

As an alternative, you can paste the generated wpDataTable shortcode manually.

Never miss new features!

Join 2000+ newsletter subscribers

Never miss notifications about new cool features, promotions, giveaways or freebies - subscribe to our newsletter! We send about one mail per month, and do our best to keep our announcements interesting.

We never spam or disclose your address to anyone.