The Structure Tree displays the content of the current page in the Visual Editor in a hierarchical tree structure. It allows you to select any component on a given page, including blocks, rows, columns, widgets, and microelements. The structure updates are reflected instantly on the canvas. Moreover, it displays customizable block names that can be modified on the Content Editor/CMS mode for easier identification.
Here you can:
- View the components of the current page.
- Select components on the page to modify their properties.
- Rename block names in the CMS mode for better organization.
Accessing the Structure Tree Panel
To access the page structure configuration options, navigate to the Visual Editor Left Panel and click on Structure Tree.
Selecting Components through the Structure Tree
Click a component in the Structure Tree to select it. Once a component is selected, you can configure it in the right-side Property Panel. Selecting a component through the Structure Tree helps you identify the component hierarchy, parent, and siblings.
When you click on different components in the Structure Tree, the corresponding components on the canvas will be highlighted and selected. Similarly, when you click on the components on the canvas, components in the Structure Tree will be selected.
Renaming Block Names on CMS
To rename the block name, follow these steps:
- Navigate to the Content Editor/CMS mode at the bottom left of the Project Dashboard.
- Access the blocks on the Layers panel in the left sidebar to view the list of components.
- Double-click on it and type the desired name.
The changes in block names will be reflected in the Visual Editor.
💡 If you have questions or concerns, contact us directly via the Live Chat box in the lower right corner. Our Support Team will provide you with top-notch quality support 24/7.