You can use the Coding toolbar to quickly add code to your page.
To find out what each button does, position the pointer over it until a tooltip appears. The following buttons are displayed by default in the Coding toolbar.
Open Documents lists the documents that are open. When you select one, it is displayed in the Document window.
Collapse Full Tag collapses the content between a set of opening and closing tags (for example, the content between <table>
and </table>
). You must place the insertion point in the opening or closing tag and then click the Collapse Full Tag button to collapse the tag.
TIP |
|
You can also collapse the code outside a full tag by placing the insertion point in an opening or closing tag and Alt-clicking (Windows) or Option-clicking (Macintosh) the Collapse Full Tag button. Additionally, Control-clicking this button disables "smart collapse" so that Dreamweaver doesnt adjust the content it collapses outside full tags. For more information, see About collapsing code. |
Collapse Selection collapses the selected code.
TIP |
|
You can also collapse the code outside a selection by Alt-clicking (Windows) or Option-clicking (Macintosh) the Collapse Selection button. Additionally, Control-clicking this button disables "smart collapse" so that you can collapse exactly what you selected without any manipulation from Dreamweaver. For more information, see About collapsing code. |
Expand All restores all collapsed code.
Select Parent Tag selects the content and surrounding opening and closing tags of the line in which youve placed the insertion point. If you repeatedly click this button, and your tags are balanced, Dreamweaver will eventually select the outermost html
and /html
tags.
Balance Braces selects the content and surrounding parentheses, braces, or square brackets of the line in which youve placed the insertion point. If you repeatedly click this button, and your surrounding symbols are balanced, Dreamweaver will eventually select the outermost braces, parentheses, or brackets in the document.
Show Line Numbers lets you hide or show numbers at the beginning of each line of code.
Highlight Invalid Code highlights invalid code in yellow.
Apply Comment lets you wrap comment tags around selected code, or open new comment tags.
<!--
and --!>
, or opens a new tag if no code is selected. //
at the beginning of each line of selected CSS or JavaScript code, or inserts a single //
tag if no code is selected. /*
and */
. Remove Comment removes comment tags from the selected code. If a selection includes nested comments, only the outer comment tags are removed.
Wrap Tag wraps selected code with the selected tag from the Quick Tag Editor.
Recent Snippets lets you insert a recently used code snippet from the Snippets panel. For more information, see Working with code snippets.
Indent Code shifts the selection to the right.
Outdent Code shifts the selection to the left.
Format Source Code applies previously specified code formats to selected code, or to the entire page if no code is selected. You can also quickly set code formatting preferences by selecting Code Formatting Settings from the Format Source Code button, or edit tag libraries by selecting Edit Tag Libraries.
The number of buttons available in the Coding toolbar varies depending on the size of the Code view in the Document window. To see all of the available buttons, resize the Code view window or click the expander arrow at the bottom of the Coding toolbar.
You can also edit the Coding toolbar to display more buttons (such as Word Wrap, Hidden Characters, and Auto Indent) or hide buttons that you dont want to use. To do this, however, you must edit the XML file that generates the toolbar. For more information, see Extending Dreamweaver.
NOTE |
|
The option to view hidden characters, which is not a default button in the Coding toolbar, is available from the View menu (View > Code View Options > Hidden Characters). |