Using the Navigator to find elements in Elementor
Learn how to use the Elementor Navigator panel to find, select, reorder, and manage elements on complex pages.
On complex pages with many sections and widgets, clicking the right element on the canvas can be tricky. The Navigator solves this problem by showing every element on the page in a clear tree structure, letting you select anything with a single click.
Quick summary
The Navigator is a panel that lists every element on your page — sections, columns, and widgets — in a collapsible tree view. Click any item in the Navigator to select it. Drag items to reorder them. Right-click for actions like rename, duplicate, or hide.
How to open the Navigator
In the Elementor editor, look at the bottom of the canvas area. You will see a small toolbar with icons.
Click the Navigator icon — it looks like a list or layers icon. The Navigator panel opens on the right side of the screen (or as a floating panel, depending on your Elementor version).
Alternatively, go to the Elementor hamburger menu and look for the Navigator option.
Reading the Navigator tree
The Navigator shows your page structure as a nested list:
Section
Column
Heading
Text Editor
Column
Image
Section
Column
ButtonEach item is indented to show what is inside what. Click the arrow next to any item to expand or collapse its children.
Selecting an element from the Navigator
Find the element you want to edit in the Navigator list.
Click it. The element is selected on the canvas, and the left panel switches to show its settings.
This is much more reliable than trying to click a small or overlapping element directly on the canvas.
Renaming elements in the Navigator
By default, elements are named by type (Section, Heading, Image, etc.). You can give them custom names to make navigation easier:
Double-click the element's name in the Navigator.
Type a new name — for example, "Hero Section" or "Services Grid."
Press Enter to confirm.
Custom names appear only in the Navigator — they have no effect on the live page.
Reordering elements from the Navigator
You can drag elements within the Navigator to reorder them:
Click and hold an element in the Navigator list.
Drag it up or down within its parent container.
Release to drop it in the new position. The canvas updates immediately.
You cannot drag an element out of its parent
You cannot drag a widget out of a column using the Navigator. The Navigator respects the page hierarchy — widgets stay inside columns, columns stay inside sections.
Hiding elements temporarily
You can toggle the visibility of any element from the Navigator without deleting it:
Hover over the element in the Navigator.
Click the eye icon that appears to the right of the element name.
The element becomes invisible on the canvas (and on the live site when published).
Hidden elements are not deleted. Click the eye icon again to show them. This is useful for quickly testing how a page looks with and without a certain element.
Right-click menu in the Navigator
Right-clicking an element in the Navigator gives you the same options as right-clicking on the canvas:
- Rename
- Duplicate
- Delete
- Save as Template
Common questions
Related guides
- A tour of the Elementor interface
- Sections, columns & widgets explained
- Duplicating & deleting elements
- Adding a new section
- Undoing changes with revision history
Need a hand?
Learn more
Working with Elementor forms
Learn how to edit, configure, and manage contact forms built with the Elementor Form widget, including fields, notifications, and submission settings.
Undoing changes with revision history in Elementor
Learn how to undo mistakes in Elementor using the undo button and the full revision history, and when to use each approach.