[V6] Create a Comparison Table Using the Row Element

Create your table

Step 1: Go to the GemPages Dashboard, select a page, and enter the Editor via the “Edit” button.

Step 2: Search for the Row element on the left sidebar. Drag & drop this element onto your page.

This Row will act as an outer container for all the elements forming the table and for you to adjust the size easily.

Step 3: Drag out another Row element and nest it inside the first Row.

This inner Row element will represent your table’s first horizontal row.

Step 4: Determine how many vertical columns your table will have. Then, select the corresponding layout for the inner Row element under the Settings tab on the left sidebar.

In the example below, the adequate number of rows is 4.

Step 5: Determine how many rows your table will have, and duplicate the inner Row to achieve the number.

To do so, click on the inner Row and select the arrow to expand more options, then click on the “Copy” icon.

Once completed, the result should look like this:

Input table content

Once you’ve set up the table, it’s time to fill it up.

Freely drag & drop elements such as Heading, Text Block, Icon, and so on to showcase your content.

Design final touches

After you have finished with the table content, use the Design tab to make small adjustments as you see fit and achieve the perfect look.

To distinguish the rows, it’s best to set different background colors as shown in this example.

When you are happy with the table, hit “Save” and “Publish” to make the changes go live on your front store.

If you encounter a problem, check out our article about Row elements.