> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.dorik.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Navigator

# Getting Started

The navigation tree on your website builder allows you to quickly navigate to any specific Section, Container, Row, Column, or Element on your web page. This also helps you keep track of the structure and keep count of the existing items on your webpage 


---

# Using Navigator

To use the Navigation Tree, follow the steps below:

- On your website builder, move your cursor to the left panel and click on the Navigator option below Global Styles.

![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/image_e2jtcq.png)


- A sidebar will appear, displaying a tree-like structure consisting of Sections or section names, Container, Rows, Columns, and Elements on that particular web page. 

**Refer to the GIF below**


![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/gif-recording-2024-05-29-at-32_14fqxbl.gif)


- Upon clicking any of the Sections, Rows, Columns, or Elements in the navigator you will be automatically scrolled to the position of that specific component on your builder.

** Refer to the GIF below**

![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/gif-recording-2024-05-29-at-32_1iiyvf5.gif)


---

# Drag-and-Drop Components

You can drag and drop the components in your builder by dragging them from the navigation itself. 

**Refer to the GIF below to see how it works**


![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/gif-recording-2024-05-29-at-32_1powh2j.gif)


---

---

## Related Articles

[Save as Collection](/en/article/save-as-collection-1hdsfx1/)

[Responsive Settings](/en/article/responsive-settings-xwzrzr/)