Creating Sortable Data Tables

Modified on Wed, 26 Apr 2017 at 08:34 PM

Ploud allows you to create tables within the WYSIWYG Editor. This is an excellent way to display tabular data that needs to be viewed within a table structure. However, there has never been a way to allow those tables and their data to be sortable. AS of Ploud's April 2017 release, tables are now sortable with a bit of work on the content author's end. Don't worry, it's easy to do following these directions.

NOTE: you can turn any table you have previously created into a sortable table, however, in this article will detail how to create a table first and then make it sortable.


To create a table, navigate to the page you want to create the table on and then click the Edit tab within the Green Toolbar

Next, place your cursor where you would like to insert the table. 

Click on the Table Menu  within the WYSIWYG Editor, select Insert Table and then select the table size you want:

Once your table has been created, start putting data in the table. Use the first row of your table as your table headers. Save your table and you will see that it looks like a pretty standard table:

What we have to do is tell the Ploud CMS which row is the header row so it uses that row for the items needed to sort your table content. In addition, we will need to add a bit of text to the table which will then cause the table to be sortable.

First, place your cursor somewhere in the top header row. Select Table -> Row -> Row Properties from the Table menu in the WYSIWYG Editor.

In the Row Type field, select Header and then OK.

The final step in getting your table to be sortable is to give what we call a 'class' to the table. It's a way of telling the Ploud CMS that this table needs to be a sortable table.

In order to do this, select Format -> Formats -> Table Styles -> Sortable Table from the Formats menu.

Click OK to save your changes. When your page is saved, you should see some changes to your table:

  1. The header rows are now clickable to sort your table.
  2. You can filter your table by using a search field.
  3. You can see different groups of table rows (10, 20, 50, etc).
  4. There will be a pagination widget at the bottom of your table that allows you to page through your table content.

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article