Blocks

Blocks have two main purposes: they are partials that can be used in the pages to facilitate re-use, and they help to separate each content in the backoffice.

Imagine you have an hero.html file witch contains the html for the hero header. The hero folder contains the data file (block options) and the variables (image and title).

+-- theme
|   +-- block
|       +-- block1
|       |-- block1.html
|       +-- block2
|       |-- block2.html
|       +-- hero
|           |-- data
|           |-- image.data
|           |-- image.var
|           |-- title.data
|           |-- title.var
|       |-- hero.html
|   +-- page
|       |-- home.html

You now have the ability to call created block in a template:

<main class="main">
    #$block|hero$#
    #$block|block1$#
    #$block|block2$#
</main>

Now, you can see in the backoffice that your template contains added block with their respective variables that you can edit.