Pages, Blocks, Columns, and Elements are the foundation of every Foleon publication.

In this article, we describe what these different components are and how they complement each other.

In this article

  • Pages
  • Blocks
  • Columns
  • Elements

Pages 

All of your content like blocks, columns, and elements are included in your publication pages. 

In terms of hierarchy, pages contain blocks, blocks contain columns, and columns contain elements.

There’s no limit to the number of pages that can be added to a publication, however, we’ve seen that publications between 10 to 30 pages perform better.

A publication with more than 100 pages could negatively affect the performance of the publication and the editor in terms of duplicating, creating PDF’s and the loading speed.

Blocks

Each page of your publication is built using Blocks. Blocks and their settings are purple. You’ll find new blocks to the left of your page.

Blocks are designed to fill in the page in terms of height and width by default.

To add new Blocks to your page click on +Block to the left of your page. You’ll find a wide variety of pre-designed blocks categorized for different use cases.

Read more about blocks in our article: Working with blocks.

Columns

Each block contains up to 6 columns with your content elements. To add columns in a block, click on the +Add column icon below the Purple block settings bar.

Note: when 5 columns are added to a block, they will have different width. The reason for that is that the entire grid consists of 24 compartments and 24 divided by 5 will result in columns with different width.

When you click to add a column you’ll see an orange outline in your page and the Orange columns settings bar.

Read more about columns in our article: Working with columns.

Elements

Columns contain your content Elements like social titles, paragraphs, images, social media buttons, videos, etc. Once you've found the element you need, drag and drop it onto your canvas.

Elements can be recognized by the blue outline and the Blue Element settings bar.

Read more about elements in our article: Working with elements.

Related articles

Did this answer your question?