Documentation › Portals › The designer

The designer

Palette, page view, structure and properties: how to build a page.

The designer has four areas, like a visual app builder.

# The four areas

• Components (left): the palette. Each component has a ? button for its documentation, and the Documentation button opens them all.
• Page (centre): what visitors will see, on a phone, a tablet or a computer.
• Structure: the tree of the page, with move, duplicate and delete buttons.
• Properties (right): everything about the selected component.

# Add and arrange

• Click a component to add it at the end, or drag it onto the page. Drop it inside an arrangement to group it.
• Click a component on the page or in the structure to select it. Drag it to move it.
• Use the arrows, duplicate and delete buttons of the structure area.

# Page view and live preview

Switch between phone, tablet and computer. When there is room, the real preview shows the true page next to the editor, updated as you type.

# Undo and redo

Undo and Redo go back and forward through your changes.

# Saving

• Save the portal stores the page. Nothing is public until you save.
• If you leave with unsaved changes, the browser asks you first.
• Reloading the page (F5) brings you back to the same screen and device.

# The list editor

An older list editor stays available for simple pages. It cannot show newer components or nested arrangements: switching to it from a page that uses them is refused.

# Layouts and templates

Ready-made layouts and reusable templates: Layouts and templates. How arrangements work: Arrangements.