ATG Control Center opens a new Document Editor window whenever you open an existing document or create one. It’s divided into three synchronized panels, each of which gives you a different view of the open document:
![](media/image32.png)
The Document Outline panel at top left, shows the full hierarchy of dynamic elements in the document, including all ATG Servlet Beans, anchors, etc. This lets you quickly find and edit dynamic elements.
The Text Editor panel on the right displays the complete code in the document.
The Dynamic Element Editor panel in the lower left enables you to set the variables in dynamic elements.
The Document Outline, the Text Editor, and the Dynamic Element Editor are synchronized. When you click on one of the elements in the Document Outline, the Text Editor highlights the code that expresses that element, and the Dynamic Element Editor displays the appropriate editor. Similarly, if you move the insertion point to a dynamic element in the Text Editor, the corresponding element is highlighted in the Document Outline.
The full path of the active document appears at the top of the Document Editor window along with the File, Edit, Insert, Window, and Help menus and toolbar. You can use the toolbar to quickly insert dynamic elements in your JSP at the location of the insertion point in the Text Editor. When you click one of these toolbar buttons, the Document Editor launches a wizard that prompts you for the information needed to complete the dynamic element. The Preview button opens the page in your Web browser. Other buttons let you save the document, print it, or view the help system.