Help CenterLanding PagesDefining landing page structure

Defining landing page structure

Last updated May 27, 2024

A landing page comprises of pages, sections and layouts. To learn what landing pages are, you can read  Decoding landing pages .

This is the second article in a list of articles designed by Mailmodo to help you launch a landing page:

Now let us, dive deep into the various basic components of landing pages.

Pages

You link pages to the landing page according to your need.

Pages and subpages

Steps:

  1. On left hand panel click on 'Pages'.
  2. Then click on 'Create new page'.

To learn more about sub-pages, read  Sub-pages in landing page .

Sections

Sections are used to organize the content easily on the page.

sections

You can either start from scratch by clicking on 'Add a blank section' or use premade sections from the drop down menu.

ℹ️

New sections appear on the bottom of the page.

We can do the following with a section:

Name a section

To name a section:

  1. Select a section by clicking on it.
  2. On the right hand side under properties there will be option to name the section.
Naming section
💡

It is a good practice to name sections.

Move a section

To move a section:

  1. On the left hand panel click on 'Layout'.
  2. Drag and drop the sections according to your need.
💡

If you are uncertain about the specific section you need to relocate, then hover over a section in the list, it will exhibit animation within your design.

Duplicate a section

Image showing duplicating section in Layout

To duplicate a section:

  1. On the left hand panel click on 'Layout'.
  2. Hover over the section you want to reuse.
  3. Click on 'Clone', the cloned section will appear just below the section from which you cloned.

Swap a section

Swap

To swap a section:

  1. Click on the section you want to swap.
  2. Hover over the 'Section' option visible on the upper left hand side of the section you chose.
  3. From the three options available, click on the 2nd one i.e. 'Swap sections'
  4. In the pop up box which appears click on 'Yes, Swap Section'.
  5. On the left hand side 'Sections' panel will open, hover over the section you want to use (or add blank section).
  6. Click on 'Swap Section'. The sections will be swapped.

Swapping the block will erase all the contents of the current block. 

Delete a section

Image showing deleting section

To delete a section:

  1. Click on the section you want to swap.
  2. Hover over the 'Section' option visible on the upper left hand side of the section you chose.
  3. From the three options available, click on the 3rd one i.e. 'Delete section'

Elements

Within a section, you have the capability to incorporate various elements, including a container, text, button, image, video, divider, logo, icon, code, and form. To learn more about elements read  Adjusting Your Landing Page Elements .

Add element

add elemnt

To add an element follow the given below steps:

  1. Click on the section you want to add an element to.
  2. Click on Elements button present in the upper middle position.
  3. Choose the element you want to add then drag and drop it in desired position inside the section.

Move element

moving element

You can easily drag and drop the elements anywhere inside the section.

Resize element

resizing elements

To resize an element, Hover over element->Drag any corner to desired size.

Duplicate element

Image showing duplication option

To duplicate an element, Click on the element->Click on the copy icon visible on the lower end.

The duplicate element will be copied just below the original one.

Delete element

Image showing deletion option

To delete an element, Click on the element->Click on the delete icon visible on the lower end.

Now we can move onto the third part i.e.  Adjusting landing page elements , in this we will learn about various elements that we can use in landing pages.

If you face any problem then reach out to us at  Mailmodo Support  or share your thoughts at  Mailmodo Product Feedback .

Was this article helpful?