Columns

In this article, we have explained about different column types

Sam avatar
Written by Sam
Updated over a week ago

Your pages basically comprise a set of Sections that hold the Row, Column and Modules within it.

In this article, let's talk about columns.

In this article, you will find the details about how to Edit, Rearrange, Resize and Delete a Column.

Editing a Column

There are two methods that you can use to edit a column.

Method 1: FROM RIGHT PANEL
To edit an existing Column, simply click on the Column in the Right Panel.

You will see the Column settings automatically displayed on the Left Panel.

Method 2: FROM CONTEXT MENU

Right-click on the respective Column and click the 'Edit' option in the drop-down menu of Context Menu.

USEFUL TIP:

  • How to change the column layout quickly:
    Select a column and choose the column layout icon.

    This will open up a popup containing different types of column layouts.

    Select the layout you require.

    The column layout of the respective column will be automatically converted to the selected layout.

    Here is how you can do this. Please see the video below

  • How to change column Padding quickly:


    When you click on any module on the right panel, an OBSERVER BAR opens up.

    Use the OBSERVER BAR to navigate to that respective column.


    At the column level on the observer bar, you will find the column padding icon. Click on that to quickly change the column padding.


    Alternatively, you can also change the padding of the column under the advanced tab in the left panel.

    Here is how you can do it. Please see the video below


Rearranging the Column

The Columns within the row can be rearranged using the respective Row's Layout Manager.


Method 1: USING THE OBSERVER BAR ON THE RIGHT PANEL

When you click on any module on the right panel, an OBSERVER BAR opens up.


Use the OBSERVER BAR to navigate to the respective row that contains the column.

Once you select the respective row through the observer bar, you will see the layout manager of the row on the left panel

In the layout manager of the row, you will the columns hosted in that particular row.

All you need to do is drag the column and drop it in the desired location in that respective row.

Here is how you can do it. Please see the video below

Resizing the columns

In the right panel, hover your cursor between two columns.

You will see a resizing tool appear in the middle of the columns.

Move it left or right to adjust the size of the columns.

Alternatively, you can also resize the column using the width option within the respective column settings.

Deleting a Column

A column cannot be deleted from the Row.

Alternatively, you can change the Column's Layout to decrease or increase the number of Columns in a Row.

Here is how you can do it. Please see the video below

You can use the 'Delete' option at a Column level of the Observer bar to delete the contents of that particular Column.



Did this answer your question?