Layers displays the active and visible parts of the current preview as a tree of rows, positions, and modules. It helps you select an exact element when it is small on the canvas or surrounded by other blocks. Elements can also be easily selected directly on the editor canvas by clicking the chosen item.
What you will learn
- Read the row → position → module hierarchy.
- Select an element without searching directly on the canvas.
- Check the order and content of a more complex template.
- Recognize current limitations of Layers filters.
Map of visible template parts
The tree operates similarly to a folder directory. At the top are major sections and rows, beneath them are Joomla positions, and inside are individual module instances. Indentation indicates nesting. This makes it easy to identify whether a menu is in the header, a cart in the right column, or a contact block in the footer.
Clicking an item in the tree selects and highlights the corresponding object on the canvas, but it does not open the right inspector on its own. Settings are displayed by clicking the small settings icon next to the given element. Layers does not create a duplicate configuration; it is simply a different view of the same design layout.
How to use Layers
- Switch the left sidebar to Layers mode.
- Locate the section by its logical area, such as the top row or right sidebar.
- Expand its position and review the list of modules in their saved order.
- Click on a module and verify that the correct block highlights on the canvas.
- Before moving or deleting, check neighboring items to ensure you target the right instance.
When the tree is most practical
Layers helps with positions containing multiple modules, visually empty blocks, and finding content within sidebars. It is also ideal for a final review: walk through the tree from top to bottom to verify that no test clones or misplaced modules remain.
Group filters currently lack controls in the active user interface. Users work with a single, unfiltered tree of currently visible and active targets.
Use the tree as a checklist before exporting. Start at the top and review every displayed row and its positions. Look out for test copies, unexpected ordering, or modules assigned only to the homepage. If an element is missing, switch device views or enable it again to refresh Layers. The tree does not indicate whether a corresponding published record exists on the live site—a separate synchronization check serves that purpose.
Read items according to their indentation, not just by similar titles. Identically named modules in different branches belong to different positions and may have different assignments.
Layers is not a live Joomla tree
The panel describes the design configuration inside Template Architect. It does not show all modules, articles, or menus existing on the target website. The actual state of Joomla modules is only compared during a synchronization check.