---
title: "Add a Table to a Template with the Wizard – Simpleway CX"
slug: "simple-table-wizard-ent"
description: "Place a table data list on your canvas, pick columns, and design one row that repeats for all data."
updated: 2023-09-27T07:59:15Z
published: 2023-09-27T07:59:15Z
canonical: "docs.simpleway.cloud/simple-table-wizard-ent"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.simpleway.cloud/llms.txt
> Use this file to discover all available pages before exploring further.

# Simple table WIZARD

The **Simple table** **wizard** lets template creators define the content of table to be displayed as a data list that iterates through the table data created in the Tables tab.

In this tutorial we will show you how to create a food menu composed of 4 items.

Topics covered:

- Templates tab - Designer - Simple table wizard
- Data source editor

**Sample screen:**

![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/2022-12-07_13h26_39.png)

---

**TUTORIAL STEPS:**

| A) Create a table on the **Tables** **tab** - see how to do this in the previous [Create and manage your tables](/v1/docs/create-manage-tables) tutorial. |
| --- |
| B) **Create a template** 1. Open the *Templates* tab. 2. Click the *New template* button. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide1(186).JPG) |
| C) **Add a Simple table** **to your canvas.** 1. Click the *Wizards* icon and choose the *Simple table* option. 2. Place the element on the canvas. A new *Tables* sub-window will open. 3. Select the table from the list that contains the necessary data for your template. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide2(226).JPG) |
| D) **Popup window for table setup appears.** 1. Select the table columns you want to use in your template by ticking the corresponding checkboxes to the left of the column names. 2. Configure the *Page settings*. 3. Configure the *Row settings*. 4. Select an existing data source for your table or select the "Create New" option to automatically create a new data source for the selected table. 5. Click the *Insert and open to row edito**r* button**.** **Note**: After inserting the table into the designer, you will be able to adjust these settings in the table data list sidebar in the *Format* mode. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide3(82).JPG) |
| E) At this point, your designer window will switch into **row template design mode****.** This is a **special mode of Designer** used to **design the contents and style of a single row of a table data list****.** You can leave this mode at any point in time by clicking *Save* or *Back* button*.* The row you will design here will be used as a template to render every row of your table**.** 1. Click the *Canvas* icon on the top right-hand menu. 2. Adjust the size of the row template to match your visual requirements. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide4(61).JPG) |
| F) Click on the *Elements* icon on the top right-hand menu and select a table element. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide5(58).JPG) |
| G) **Modify template element** 1. Adjust the **position**, **size**, **font style** and **alignment** of your template element to match your visual requirements using the sidebar. 2. Click the *Save* button to save your changes and exit the row template design mode. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide6(51).JPG) |
| H) **Table data list settings** 1. Reposition the table. 2. Set the number of rows if necessary. 3. Set the paging properties of the list and the page order if necessary. **Note 1**: The size adjustment is only available in the row template mode. **Note 2:** Paging will start automatically when your input data has more rows than your number of rows configured on your table data list. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide7(49).JPG) |
| I) *Optional:* If you want to edit the row template again: 1. Click the blue button with the name of your table. A new window opens with a list of row templates. 2. Click the three-dot button on the row template item and select *Edit*. You will be again in the Row template designer where you can edit the row, follow steps E, F and G of this tutorial. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide8(43).JPG) |
| J) **Further design ideas for your food menu display content:** - - - Add your logo or other media from the Media library, - Add headers using static text, - Add a rectangle to highlight the column names, - Change background color. | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide8(40).JPG) |
| K) Click on the *Save & Publish* button in the lower right-hand corner when your template is final. Now it is **ready to be assigned and shown on your display.** | ![](https://cdn.document360.io/a3e67867-6316-451b-94ad-ec727ac9102a/Images/Documentation/Slide9(25).JPG) |

###