Dreamweaver CS4 Toolbars – Part 3
Posted by admin | Posted in Adobe, Adobe Dreamweaver CS4, Tutorials | Posted on 12-06-2009 | Views: 167
0
Author: Jeremy Reis
Coding Toolbar
In Code and Split views, the Coding toolbar is displayed by default (if it’s hidden, you can show it by opening the View menu and selecting Toolbars and then Coding—but note that the toolbar isn’t available in Design view). This toolbar contains tools for working with the source code for the active page:
Open Documents – Opens a pop-up menu of documents currently open, allowing you to switch between them.

Collapse Full Tag – Collapses the contents of an HTML tag, allowing you to get a better view of surrounding tags. You can click the small plus sign next to the collapsed tag to display it again. ![]() |
|
Collapse Selection – Collapses an entire selection, so multiple tags may be hidden. You can click the small plus sign next to the collapsed selection to display it again. ![]() |
|
| Expand All – Expand all collapsed tags and selections. | |
| Select Parent Tag – Selects the opening and closing tags of the current element. This feature is useful for ensuring that you’ve included all closing tags; if you continue to click this button, Dreamweaver will highlight more and more enclosing tags, working its way from your current position to the outer-most opening and closing body tags. (This is called “balancing.”) | |
| Balance Braces – Balances braces as described above, but for scripting symbols (parentheses, braces, square brackets). | |
| Line Numbers – Displays or hides the line numbers next to the code. | |
| Highlight Invalid Code – Highlights invalid code. | |
Syntax Error Alerts in Info Bar – For scripting, displays error alerts at the top of the Document window and highlights the line of code containing the error: ![]() |
|
| Apply Comment – Converts a selection to a comment (which is ignored by the browser). This button opens a pop-up menu containing several types of comments you can choose from (e.g., HTML, CSS, Visual Basic, etc.). | |
| Remove Comment – Removes the comment tags from the selected line of code. | |
Wrap Tag – Wraps the selected element in opening and closing tags, which you can choose from a pop-up menu: ![]() |
|
| Recent Snippets – Opens a pop-up menu containing recently-used snippets you can insert. | |
| Move or Convert CSS – Opens a pop-up menu allowing you to convert inline CSS to a CSS rule or export the selected CSS rule(s) to an external style sheet. | |
| Indent Code – Indents the current line of code. | |
| Outdent Code – Reduces the indention of the current line of code. | |
| Format Source Code – Applies code formatting based on the selections in the Preferences dialog, which you can access by selecting Code Format Settings from the pop-up menu that opens when you click this button. You can also edit tag libraries from here, by selecting Edit Tag Libraries from the pop-up menu. |
Note:
All the buttons on the Coding toolbar may not be visible. To see any hidden buttons, click the
button at the bottom of the toolbar.
Document Toolbar
Use the buttons on the Document toolbar, located just above the Document window, to switch between Code, Split, and Design views. In addition, the Live View button displays the page as it appears in the browser. The Live Code button displays the code the browser uses to render the page.
The Document toolbar also contains commands for naming, previewing, and publishing the current document:
| Title – Lets you specify a title for the page, which appears in the title bar of the browser’s viewer. | |
File Management – Provides a menu of file management options for the page, including a command to upload the page to your web server . |
|
| Preview/Debug in Browser – Lets you preview the page in the browser you select. | |
| Refresh Design View – Refreshes the appearance of the page in Design view after you’ve made changes to it in Code view. | |
| View Options – Lets you specify various settings for the current view, including word wrap, hidden characters and syntax coloring. | |
| Visual Aids – Lets you turn on visual aids in Design view, including CSS layout backgrounds, the CSS Layout Box Model, table widths and morders, image maps and invisible elements. | |
| Validate Markup – Lets you validate the current document, the site or selected files in the site. | |
| Check Browser Compatibility – Provides options for checking browser compatibility and accessibility for the active document. |
If you don’t see the Document toolbar, open the View menu and select Toolbars, and then Document to show it.
Standard Toolbar
The Standard toolbar, located just below the Document toolbar, contains many of the same commands you’d find on other Windows
toolbars:
| New – Create a new document. | |
| Open – Open an existing document. | |
Browse in Bridge – Starts Adobe Bridge (Bridge must be installed). |
|
| Save – Save the current document. | |
| Save All – Save all open documents. | |
| Print Code – Print the source code for the page. | |
| Cut – Cut the current selection. | |
| Copy – Copy the current selection. | |
| Paste – Paste the contents of the clipboard. | |
| Undo – Undo the last action. | |
| Redo – Redo the last action in the undo history. |
To display the Standard toolbar, open the View menu and select Toolbars, and then Standard.
Popularity: 1% [?]
No Tag













