Modules

In this article, you will find the details about how to Add, Edit, Delete, Duplicate, and Rearrange a Module

siddarth avatar
Written by siddarth
Updated over a week ago

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

Modules are present within a Column. There can be any number of modules with the column.


The Modules are added one below the other within a Column.

In this article, you will find the details about how to Add, Edit, Delete, Duplicate, and Rearrange a Module.

Adding a Module

Method 1: FROM THE RIGHT PANEL


A ‘+’ icon will appear on the Top and Bottom of any module as you hover around the region.

When you click on that '+' icon, you will see the modules tab open up on the left panel.

Click on the module you wish to add and it will automatically be added within that column.

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

Method 2: USING AN EMPTY COLUMN

You will see a plus icon in the middle of any empty column.

Once you click on that Plus icon, this will open up the modules tab on the left panel.

Click on the module you wish to add and it will automatically be added within that column.

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

Method 3: FROM TREE VIEW

Click once on a particular module and then, click on the tree view icon.

This will open up the tree view of that particular module.

Click on the 'ADD MODULE' button present there.

Once you click on the "Add Module' button, this will open up the modules tab on the left panel.

Click on the module you wish to add and it will automatically be added within that column.

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

Editing a Module

Click on the respective module on the Right panel that you wish to edit.

Once you click on that module, The respective settings of that particular module will open on the left panel.

Any changes done to the setting will reflect on that particular module on the right panel.

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

Delete a Module

Below are various methods in which you can delete a Module.

Method 1: USING OBSERVER BAR

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


You will find the delete icon on the observer bar at the module level.


Click the delete button on the observer bar to delete the module.

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

Method 2: USING TREE VIEW -

Click once on a particular module and then, click on the tree view icon.


This will open up the tree view of that particular module.

On the particular module panel, You will find the menu icon. Click on that menu icon and a drop-down menu will open up.

Select the option ' Delete' to delete that particular module.

Duplicating a Module

Below are various methods in which you can duplicate a Module.

Method 1: USING OBSERVER BAR

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

You will find the duplicate icon on the observer bar at the module level.


Click the duplicate button on the observer bar to duplicate the module.

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

Method 2: USING TREE VIEW


Click once on a particular module and then, click on the tree view icon.


This will open up the tree view of that particular module.

On the particular module panel, You will find the menu icon. Click on that menu icon and a drop-down menu will open up.

Select the option ' Duplicate' to duplicate that particular module.



Rearranging the Modules

Below are various methods in which you can rearrange a Module.

Method 1: USING THE RIGHT PANEL

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


On the observer bar, you will find the drag Handle icon.


Click on the drag handle icon on a module, and drag that module to wherever you want to place it.

As you drag the module, a blue border will be visible on all possible drop targets.


You can drop the module on a different column, Row, or even on a different section.

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

Method 2: USING THE LEFT PANEL

Click once on a particular module and then, click on the tree view icon.


This will open up the tree view of that particular module.

Click on that module on the left panel and drag it to where you want to place it.

You can drop the module on a different column, Row, or even on a different section on the tree view of the left panel.

Once you drop the module on the desired location on the left panel, this new location of the module will be updated automatically on the right panel.

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


Did this answer your question?