Advanced Mosaic (block editor)

The block editor allows you to create e-mails/pages quickly and easily through the drag & drop function. Using this method means that you will probably never need to use HTML or CSS. The advanced builder allows you to automatically create, responsive e-mails or pages, which will also be adapted to the device on which they are shown (PC, Tablet or Smartphone).

The Advanced Builder can be found in both the “E-mails” and “Landing Pages” modules.

To use the Advanced Builder just click on “Advanced Builder” and then on “Launch Advanced Builder”.

At the top of the page you will find a toolbar with the following buttons:

 

  • Close: Temporarily save the modifications and close the editor
  • Editor: Opens the drawing window
  • Development Preview: Allows you to see the grids used
  • Source Preview: Shows you a preview of the e-mail
  • Dowload: Allows you to download the Source Code of the e-mail
  • Clear: Performs a reset of the editor
  • Undo: Allows you to undo the last change
  • Redo: Allows you to place again a change you just cancelled

On the left-hand side you will find all the boxes that you can drag in the Container:

GRID SYSTEM:

These components allow you to create the layout of the e-mail.

  • 1 column full width: Allows you to create a row within a column that has the maximum width (based on the device)
  • 1 column: Creates one row with one column
  • 2 columns: Creates one row with two columns
  • 3 columns: Creates one row with three columns

COMPONENTS:

These are content objects such as text, images, etc etc…

  • Title: Represents a title that can have three different sizes: Small, Medium, Large
  • Paragraph: Allows you to place a paragraph box in which you can place a text
  • Bullet List: A list of elements
  • Image: Allows you to place an image
  • Botton: Allows you to place a botton
  • Separator: Allows you to place a separation

 

PAGE COMPONENTS:

  • Blockquote: A block that defines a text taken from another source of information
  • Button: A button
  • Table: A table

In the text components you can directly click on the component to change the content.

By clicking on the component you will be able to see the various options:

  • Drag: Click here to move the component
  • Remove: Click to remove the component
  • Common Options: These are the common options for almost all the components to which you can change the border, the background color, the margins, etc etc…
  • Editor: Allows you to see the editor. Use the drop-down menu at the top to insert the keywords for the program (such as the dynamic fields of the leads)
  • NAME COMPONENT Options: These are the options which are specific for that component

Note: Components must be within a column. First create the layout through the GRID SYSTEM and then create the components inside those columns.