Setting up pages layout

Turn on the header for the page, if you want it to be visible. By default header is a page title, but you can edit it.

Tabs, sections and columns

Everything on the page can be dragged-and-dropped!

Copying sections with components

Select the section with components you want to copy and click the button "Copy section"

Adding and configuring components

Drop the components to columns and configure them.
Click Preview the see the resulting page.

Desktop, tablet and mobile views

Each section can contain one or a few columns (which are the containers for components). If there are more than two columns in a section, we can configure how to display them: in a row, or in a column for three views:
  • Mobile. From 0 to 478 px width;
  • Tablet. From 479 px to 768 px width;
  • Desktop. From 768 px and more.
Choose the direction in a section settings:
A component may have its own layout for mobile/tablet/desktop view. Icon in the right-bottom corner shows you which option is applied for the certain column width.

Conditional tabs visibility

Each tab can be set up as visible for certain groups of users:

Conditional sections visibility

In the same way, each section also can be set up as visible for certain groups of users.
Don't forget to take into account security settings setting up API-endpoints! Configuring conditional visibility is not enough!