Navigator Panel



The Navigator panel is on the left and has the following items:

For a new project or a project that contains no elements, an expanded Elements panel is also displayed at the beginning.



Here you can find the list of all elements added to the page in the order they appear on the canvas. 

Hierarchical list of elements located on the page displays all the elements and their relationship. The higher the element in the list, the higher it on the web page. (For more details, see: Block-based website model and element hierarchy).

The list of elements on the tab helps you navigate through the elements on the Canvas. When hovering over the name of an element on the Layers tab, the element is outlined on the Canvas. When clicking on the name of an element, the element is highlighted on the Canvas.

When selecting a parent element, all its children will be selected too.

Using the Layers tab you can:

On the Layers tab, you can also drag elements above or below, or nest within other elements. For more details, see: Adding and moving elements.

Here you can find components created for the project. For more details about components, see: Components.

You can add any existing component to the canvas by selecting and dragging it to the desired position on the canvas.

The component can be renamed (Rename component) or deleted (Delete component) with the right mouse button.

Here you can find all the project pages. When you create a project, two pages are created automatically: Page 1 (Main Page) and 404 error page, which is displayed when the requested page does not exist. 

Click New page to add a new page to the project.

Using the Pages list you can:

You cannot delete the page if it is the only page on the website (other than the error page). To delete the page, you first need to create a new one.



You can open the Page settings by clicking on the “gear” icon to the right of the page name in the page list.

Here you can change the page name, its slug (the name displayed in the page URL), as well as set SEO settings and add custom code (For more details, see: Page settings).

To the right of the tab names is the + button, which is used to add elements to the Canvas. When you click on this button, the Elements panel opens on the right, with which you can add the necessary elements and widgets.

Elements panel contains a list of all elements and widgets available for insertion into the page.

Elements are grouped as follows:

The list of elements in groups can be collapsed or expanded using the arrow to the left of the group name. Detailed description of the elements – Elements and Widgets.

You can add an element to the web page by clicking on its name on the Elements tab or by dragging it onto the Canvas with the mouse. For more details about adding elements to the page, see: Adding and moving elements.

You can close the Elements panel by clicking on the close button.



You can pin the Elements panel by clicking on the button to the left of the close button.

Clicking this button will pin the Elements panel in the Navigator Panel below the Layers tab. Space for Layers and Elements tabs is distributed equally.

You can change how space is distributed between the Layers and Elements by dragging the dividing line between them up and down with the mouse.

You can unpin the Elements panel by clicking on the button to the right of the tab names (this button appears instead of the + button with the pinned Elements panel).

For ease of use, especially on smaller screens, you can minimize the Navigator Panel to make more room for the Canvas. This can be done by clicking on the < button that appears when hovering on the Navigator Panel.

Minimized Navigator panel looks as follows.

To expand the Navigator Panel, click on the > button that appears when hovering on the panel.

When minimized, the panel elements are indicated by icons, which are arranged from top to bottom as follows:

When clicking on the icon, the corresponding panel opens on the right.