Skip Navigation
Search

Editing Tables

To use tables to display your content, you need to first make sure you are using your table to show data, not to create a layout.

Using Responsive Tables

To ensure your table works well on both mobile and desktop layouts, choose an option below.

I have an existing table that I need to make responsive.

I am creating a new table.

 


 

If you have an existing table:

  1. Right-click on the table.
  2. Click on Table Properties.
  3. Look for the Class dropdown. Choose from Responsive Data Table, Responsive Data Table Light Header, Responsive Data Table Medium Header, Responsive Data Table Dark Header, Responsive Data Table White BG, or Responsive Data Table Grey BG.
  4. Save.
View Demo

Here's a walkthrough (click image to restart tutorial):

Updating a table to be responsive - animated gif image

 

If You are Creating a New Table:

  1. Click the Insert Snippet button.
  2. Search for table.
  3. Insert the Responsive Data Table snippet.
  4. Enter your data, adjusting your rows and columns as needed. Remember, you can right-click and use the Table actions to add or remove rows and columns!
  5. To customize the Responsive Data Table, right click on the table.
  6. Click on Table Properties.
  7. Look for the Class dropdown. Choose from Responsive Data Table, Responsive Data Table Light Header, Responsive Data Table Medium Header, Responsive Data Table Dark Header, Responsive Data Table White BG, or Responsive Data Table Grey BG.
  8. Save.
View Demo

Here's a walkthrough(click animation below to restart tutorial):

How to Insert a Responsive Table - animated gif image