Use the Layers tab in the Visual Editor to manage the structure of a layout. The Layers tab lists all blocks in the layout and displays how blocks nest within each other.
- To add a layer, drag a block into the work area.
- Identify how blocks are organized and nested, and drag and drop to rearrange or change the layout.
- Rename layers, use indicators to manage complex layouts, and recognize data bindings or actions.
- Search by name or element type and expand nested layers to navigate large or intricate designs.
To work the the Layers tab in your Fusion Project, you must be in Design mode.
To access the Layers tab, you must have the Editor role or higher in your Space. To learn more, see Fusion Roles and Permissions.
To display layers in the Visual Editor, click the Layers tab.
The Layers tab represents the content structure of the layout.
When you select a block in the work area Builder highlights the matching layer, just as selecting in the Layers tab highlights the block in the work area.
Use the Layers tab to add, rename, move, group, ungroup, lock, unlock, and delete layers to keep the layout organized.
Select layers to modify, move, group, or delete the corresponding blocks. You have several options for selecting layers:
- Click the layer to select.
- Hold
Cmd/Ctrlwhile clicking to select multiple layers. To select a continuous range, click the first layer, holdShift, and click the last layer.
Reorder layers or nest within a container by dragging it into a new position. A blue highlight represents the position of the layer.
You can also drag a layer into another layer to nest layers. Expand or collapse layer groups in the layers list.
Moving a layer impacts the layout structure. If the layer is moved outside the parent, the layer doesn't inherit the parent’s styles.
Use clear and descriptive names to identify the purpose of each layer. Meaningful names can improve clarity, support navigation, and help locate layers using the search field in complex layouts.
Rename a layer in either of two ways:
- Double-click the layer to change the name.
- Right-click the layer and choose Rename.
Lock layers to prevent accidental edits or movement while working in the Visual Editor.
- To lock a single layer, right-click the layer and select Lock layer. To unlock, click the lock icon next to the layer name.
- To lock a group, right-click the group and select Lock group. To unlock, right-click and select Unlock group.
Alternatively, use the keyboard shortcut Cmd + Opt + g (Mac) or Ctrl + Alt + g (Windows) to toggle the lock status for groups.
Group related layers to organize your layouts:
- Select multiple layers.
- Press
Cmd/Ctrl + gto group layers inside a Box block or right-click and select Group selection.
Ungroup layers to edit or move individual blocks:
- Select the grouped layers.
- Press
Cmd/Ctrl + Shift + gto ungroup or right-click and select Ungroup.
Delete layers one of two ways:
- Select a layer and press Delete.
- Right-click on the layer and choose Delete.
For more information on using shortcuts, see Keyboard shortcuts in the Visual Editor.
- To learn more about adding blocks using the Visual Editor, see Fusion Insert tab.
- For details on the Block types, see Fusion Block types.