Layer Tree

The layer tree gives you an overview of the entire structure of the currently selected page. Here you can view each layers attributes, such as whether it’s locked, as well as being able to organize your document by renaming and reordering layers.

Layer options

Right clicking any layer in the layer tree will reveal the edit options for that layer. From these options, it’s possible to Delete, Duplicate and Collapse the currently selected layer. These options also allow you to assign a colour key to a layer, which is a great way to organise your identify key layers.

Layer Tree settings

The layer tree offers a range of settings that enable you to customize the way the layer tree functions.

Scroll to selected

When enabled, the scroll to selection option will scroll the design canvas to the currently selected layer tree item so that it appears in the vertical center of the design canvas.

Include ID in layer title

When enabled, the layer tree will display an objects ID as part of the layer name.

Include class in layer title

When enabled, the layer tree will display an objects custom classes as part of the layer name.

Solo Mode

When enabled, solo mode will automatically expand and collapse the layer tree items based on the currently selected item. This helps to keep the layer tree organised with larger projects.

Expand all

This button lets you quickly expand all of the layers in the layer tree.

Collapse all

This button lets you quickly collapse all of the layers in the layer tree.

Locked layers

Most layers can be freely moved and deleted, however, some layers are locked. The reason they are locked is to prevent them being removed or moved out of place as this would simply break a sites layout and functionality.

Beginner Tip

Locked layers can’t be moved or deleted, however, they can have custom classes, animations and other settings applied, allowing a deeper level of visual control over your site.

Updated on 11th June 2019

Was this article helpful?

Related Articles