How to access the outline panel

The Outline panel offers a comprehensive overview of your layout's content, providing a simplified and intuitive interface to easily edit, organise, and interact with layout elements.

Access the Outline panel by clicking the Outline icon in the Top Bar. This panel displays your page layout in a hierarchical outline format, allowing you to easily view and modify its structure

Use the actions menu (identified by the Ellipsis icon) in the Outline Panel to quickly expand or collapse all items, toggling their visibility

Right-click on any row, column, or module to access a context menu with available options. A blue outline will also highlight the selected item. The options vary depending on the item:

- Rows and Columns: Open Settings, Remove

- Modules: Open Settings, Duplicate, Remove

To help identify the purpose of a row, column, or module in the Outline Panel tree view, you can add a label through the Advanced tab. 

Icon Indicators in the Outline Panel

The Outline Panel displays icons to indicate modifications to rows, columns, or modules. These icons provide a visual cue for customised settings.

Icon Meanings

Blue Eye: Visibility display state is modified from the default "Always" state.

Red Eye: Conditional Logic option is enabled.

Exclamation: Module is missing from the layout.

Code: Custom CSS or JavaScript is added to a row, column, or module through the Advanced tab.