The HTML Table Editor

Overview

The Table Editor is an intuitive interface to design your table. When loaded, you will see your table on the right, the Table Editor form on the left, and the Column Editor and Get Code buttons above the table.

Some options update in real time. Other options require you to click Save first, then refresh the table preview. This page focuses on the options shared by all table types.

Image of the table editor

Table editor.

Global Options

The Table Editor form allows you to change global options about your table. It is split into two sections: General Options and Table Design.

General Options

The General Options section allows you to choose your table name, table type and whether or not you want the column picker. The table name is required in order to save.

You can also control filtering, ordering and paging from this section. For large tables, paging may be required to keep your table responsive.

Column Sizing

In the table editor you can hover over and drag columns to the size of your choosing.

Table Types

Tables can be three main types: Regular, Dynamic and Statistics. We have dedicated pages for each type so you can choose the best setup for your use case.

Visual Design

The Table Design section of the Table Editor is for visual design. You can choose header background colour, header text colour, font and whether to show or hide our watermark. These options allow you to align the table with your brand.

Mobile Fullscreen

Tables are often difficult to view on mobile phones, due to the narrow tall displays. If you enable the fullscreen button, mobile users will be able to view the table fullscreen in landscape mode.

Large Tables and Async Queries

Large tables and statistics tables can use async queries. This means filters, sorting, paging and column changes are handled by server-side requests rather than loading every row at once in the browser.

Read the dedicated guide here: Large Tables and Async Queries.

Get Embed Snippet

Once you are happy with your design and have clicked ‘Save’ to save the table, you can click the ‘Get Code’ button to copy a small HTML snippet that will allow you to paste the table wherever you need in your own website.